双向绑定和后台更新不重新渲染组件

Posted 2023-03-27

【中文标题】双向绑定和后台更新不重新渲染组件

【英文标题】：Two-way binding and background update does not re-render component

【发布时间】：2021-04-07 13:33:59

【问题描述】：

我有一个 Blazor 服务器端项目，其中有一个自定义组件，它使用视图模型绑定到 inputbase 复选框。

如果我通过单击按钮更改视图模型，一切正常。 但是，如果我通过更多“背景”来更改视图模型，例如 GRPC 推送消息，则不会重新渲染 inputbase 复选框。

【参考方案1】：

只要更改的原因与 UI 相关，例如单击按钮、字段中的输入更改等，在大多数情况下，渲染周期都会由 Blazor 启动。

但是，如果原因是更嵌套的东西，例如计时器或完成的异步调用，您可以在组件中使用方法 StateHasChanged 来触发新的渲染周期。

正如评论中提到的，在 UI 线程之外调用此方法时可能会有缺点。 await InvokeAsync(StateHasChanged) 有助于缓解问题。此外，它几乎是异步的，这更像是 Blazor 的“服务器化”。

【讨论】：

根据您调用它的时间和方式，最好使用await InvokeAsync(StateHasChanged); - 这将是 1) 与所有服务器端 blazor 一样异步 2) 将在上下文中运行该方法主（UI）线程，所以它有效果，否则如果调用者在另一个线程上，它甚至可能抛出。

感谢@rdmptn 指出这一点。我已经更新了答案。