Blazor使用await InvokeAsync(StateHasChanged)子组件参数未同步更新怎么办

你给子组件传参的方式本身没有语法错误，问题出在状态更新的时序和方法定义的错误上。

核心原因 #

1. async void的使用问题：你把事件处理方法SetBool定义为async void，这是Blazor开发的禁忌。Blazor只会对返回Task的异步事件处理做生命周期跟踪，在方法执行完成后自动触发渲染；async void方法的执行进度Blazor完全感知不到，会导致渲染时序不可控。
2. StateHasChanged的执行逻辑：await InvokeAsync(StateHasChanged)只是把渲染请求加入Blazor的渲染队列，不会等待渲染完成就会继续执行后续代码。你调用完它之后立刻执行await Child.Trigger()时，父组件的渲染还没执行，子组件的Bool参数还没有接收到新值，所以Trigger里读取的还是上一次的旧值，自然更新不对。等你第一次点击的逻辑全部执行完，父组件才完成渲染、子组件的参数才会更新，所以第二次点击时Trigger才能拿到上一次更新的参数，看起来就慢了一步。
3. 为什么await Task.Run(StateHasChanged)看似正常？因为Blazor WASM是单线程运行环境，Task.Run提交的任务会排在当前同步上下文的所有任务之后执行，反而阴差阳错让子组件参数更新的时机跑到了Trigger执行之前，但这种时序完全依赖运行环境的线程调度，在Blazor Server或者高负载场景下必然出问题，而且不支持bUnit测试，确实应该彻底废弃。

解决方法 #

最佳方案：让子组件自主响应参数变化 #

完全不需要手动调用子组件的Trigger方法，也不用手动调用StateHasChanged，符合Blazor的声明式渲染设计：

1. 把父组件的SetBool返回值改为async Task，删除手动的StateHasChanged调用和Trigger调用：

private async Task SetBool(bool name)
{
    Bool = name;
    title = Bool ? "True" : "False";
    // Blazor会自动在异步事件处理完成后触发渲染
}

2. 子组件重写OnParametersSet方法，监听Bool参数变化自动更新title：

protected override void OnParametersSet()
{
    title = Bool ? "True" : "False";
}

兼容方案：如果你必须手动调用子组件的Trigger方法 #

调整时序保证调用Trigger前子组件已经拿到最新参数：

1. 把SetBool返回值改为async Task
2. 调用InvokeAsync(StateHasChanged)后加一行await Task.Yield()，让出当前线程让Blazor先完成渲染和参数同步：

private async Task SetBool(bool name)
{
    Bool = name;
    title = Bool ? "True" : "False";
    await InvokeAsync(StateHasChanged);
    await Task.Yield(); // 等待渲染完成、子组件参数更新
    await Child.Trigger();
}

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