Correct pattern for two way binding on nested components in blazor server?

I have a series of nested components. In an inner component, I'm using a 3rd party vendor component. I then also wrap that component in an outer component, then place the outer component on the page.

Forgetting whether nesting this many layers is appropriate or not, is this the correct pattern to bind the property on my page, through to the 3rd party component?

You have to explicitly raise a changed event, so the changed event bubbles all the way to the top? I ask because it took me a few iterations to get here, as many of the articles I read did not suggest having to chain the change event like this, so I'm just trying to make sure I'm not recreating something the framework already does for you.

My inner component:

<VendorComponent @bind-PropertyA="PropA", @bind-PropertyA:after="OnPropAChanged">@code {    [Parameter]    public string PropA { get; set; }    [Parameter]    public EventCallback<List<string>> PropAChanged { get; set; }    public async Task OPropA Changed() {await PropAChanged.InvokeAsync(this.PropA);}}

My outer component:

<MyInnerComponent @bind-PropertyA="PropA", @bind-PropertyA:after="OnPropAChanged">@code {    [Parameter]    public string PropA { get; set; }    [Parameter]    public EventCallback<List<string>> PropAChanged { get; set; }    public async Task OPropA Changed() {await PropAChanged.InvokeAsync(this.PropA);}}

My page:

<MyOuterComponent @bind-PropertyA="PropA">@code {    public string PropA { get; set; }    }