在兄弟页面上调用 StateHasChanged

Question

我有一个带有声明为 CascadingValue 的 Order 对象的页面。该父页面有 2 个子页面，一个包含订单信息，另一个包含订单上的订单项列表。这些同级页面中的每一个都通过 CascadingValue 使用订单信息。

订单信息页面上有一个按钮，可以清除订单上的所有订单项。该按钮有效，并且通过调用 Order CascadingValue 上的 ClearLineItems 方法清除所有行项目。

不过，包含订单项列表的页面并未刷新。它仍然显示现在已删除的订单项。一个页面如何告诉它的兄弟页面它的 StateHasChanged？

要绘制行项目，我有一个名为 LineItemDetail 的控件，我将其绘制成这样。 （每一行都有一个按钮，可以让用户只删除那一行，就是DeleteLine参数。逐行删除正常工作）

@foreach (var row in CurrentOrder.LineItems)
{
    <LineItemDetail CurrentLine=@row DeleteLine=@DelLine></UpchargeInfo>
}

真正更大的问题是如何将消息从一个 Blazor 页面发送到另一个页面。类似于消息总线，但在 Blazor 内部。

这说明了问题所在。从子表单添加行项目不会更新父表单，也不会更新其他兄弟表单。必须主动刷新父级，这将级联并更新子级。 https://github.com/bradirby/BlazorChildFormUpdates

Answer 1

我原来的答案似乎已经过时了；除了使用 EventCallbacks 可能是解决方案的部分。

所以这是我的新答案：

添加对组件的引用。像这样的：

<Component1 @ref="comp1" SiblingComponent="@comp2" />
<Component2 @ref="comp2" SiblingComponent="@comp1" />

@code {
    public ElementReference comp1 { get; set; }
    public ElementReference comp2 { get; set; }
}

然后在 Component1 和 Component2 中调用SiblingComponent.UpdateState()

然后 SiblingComponent 补充

private void UpdateState() {
    StateHasChanged();
}

显然过时的答案：

最有可能的问题不是没有调用 StateChanged，而是实际上同级页面的状态没有改变。 您不能更改子组件中的级联值。它只会针对该子组件中的副本进行更改，而不会在父组件中更改。 你有一些选择；但最合适的可能是回调方法。您对子组件的操作会触发父组件中的一个方法，该方法会更改父级别的值，从而更新子组件中的值。