Blazor嵌套控件值绑定问题：页面属性未更新，实现是否正确？

我有一个页面控件，其中包含名为MyControl的自定义控件，MyControl内部使用了第三方Autocomplete控件。在MyControl中，我将Autocomplete控件绑定到自身的参数及对应的EventCallback：

<Autocomplete 
              @bind-SelectedValue="@SelectedValue"
              @bind-SelectedText="@SelectedText">
</Autocomplete>

@code {
  [Parameter] public int SelectedValue { get; set; }
  [Parameter] public EventCallback<int> SelectedValueChanged { get; set; }

  [Parameter] public string SelectedText { get; set; }
  [Parameter] public EventCallback<string> SelectedTextChanged { get; set; }
}

现在我在页面中尝试将MyControl绑定到页面的SelectedText属性，但页面的属性并未更新：

<MyControl @bind-SelectedText="SelectedText"></MyControl >

@code 
{
  [Parameter] public int SelectedValue { get; set; }
   
  [Parameter] public string SelectedText { get; set; }
}

请问当前的实现是否正确？

当前实现不正确，核心问题出在MyControl对双向绑定的处理逻辑上：

• Blazor组件的参数由父组件维护，子组件不能直接修改参数值，必须通过对应的EventCallback通知父组件完成更新。你直接用@bind-将第三方控件绑定到子组件的参数属性，相当于让第三方控件直接修改了子组件的参数，并没有触发子组件对外暴露的EventCallback，所以父页面的属性无法收到更新通知。

• 第三方Autocomplete的@bind-语法本质是绑定了属性和对应的变更事件，你需要手动接管这些事件，转而调用子组件自己的EventCallback。

修正后的MyControl代码 #

<Autocomplete 
              SelectedValue="@SelectedValue"
              SelectedText="@SelectedText"
              SelectedValueChanged="OnSelectedValueChanged"
              SelectedTextChanged="OnSelectedTextChanged">
</Autocomplete>

@code {
  [Parameter] public int SelectedValue { get; set; }
  [Parameter] public EventCallback<int> SelectedValueChanged { get; set; }

  [Parameter] public string SelectedText { get; set; }
  [Parameter] public EventCallback<string> SelectedTextChanged { get; set; }

  private async Task OnSelectedValueChanged(int newValue)
  {
      // 通过EventCallback通知父组件更新参数
      await SelectedValueChanged.InvokeAsync(newValue);
  }

  private async Task OnSelectedTextChanged(string newText)
  {
      await SelectedTextChanged.InvokeAsync(newText);
  }
}

父页面的注意点 #

如果页面的SelectedText是内部状态而非路由/父组件传递的参数，需要去掉[Parameter]标记，改为普通属性：

<MyControl @bind-SelectedText="SelectedText"></MyControl>

@code 
{
  // 内部状态无需标记[Parameter]
  public string SelectedText { get; set; }
}

这样修改后，当Autocomplete的选中内容变化时，MyControl会通过EventCallback通知父页面更新对应属性，双向绑定即可正常工作。

内容的提问来源于stack exchange，提问作者Jeremy