Blazor中AppState状态变更仅父组件更新子组件未刷新问题求助

问题根因 #

子组件仅直接读取AppState的属性，未订阅OnCurrentWikiPageChanged状态变更事件。Blazor运行时默认仅在组件自身的参数变更、事件触发时主动重绘，跨组件的状态变更需要手动订阅通知触发StateHasChanged，因此只有订阅了事件的父组件会更新，子组件不会响应。

修复方案 #

1. 子组件补充事件订阅与销毁逻辑 #

在子组件的@code块中添加如下代码，订阅状态变更事件，同时在组件销毁时取消订阅避免内存泄漏：

@code {
    // 你原有声明的其他属性，例如：
    public List<WikiDetailDto> RecommendedWikiPages { get; set; }

    protected override void OnInitialized()
    {
        // 状态变更时触发子组件重绘
        AppState.OnCurrentWikiPageChanged += StateHasChanged;
        base.OnInitialized();
    }

    // 组件销毁时取消订阅，避免内存泄漏
    void IDisposable.Dispose()
    {
        AppState.OnCurrentWikiPageChanged -= StateHasChanged;
        base.Dispose();
    }
}

注意：父组件也需要补充上述Dispose逻辑取消事件订阅，否则会出现内存泄漏问题。

2. 最佳实践优化 #

依赖注入解耦

建议将AppState注册为服务而非静态类使用，更利于单元测试和代码解耦：

1. 在Program.cs中注册服务：

// Blazor WebAssembly用AddSingleton，Blazor Server用AddScoped
builder.Services.AddScoped<AppState>();

2. 在需要使用的组件中通过注入访问：

@inject AppState AppState

异步事件适配

如果存在异步更新状态的场景，可将事件改为异步版本避免UI线程阻塞，修改AppState代码如下：

public WikiDetailDto CurrentWikiPage { get; set; }
public event Func<Task> OnCurrentWikiPageChanged;
public async Task SetCurrentWikiPage(WikiDetailDto wikiPage)
{
    CurrentWikiPage = wikiPage;
    if (OnCurrentWikiPageChanged != null)
    {
        await OnCurrentWikiPageChanged.Invoke();
    }
}

对应组件的订阅逻辑调整为：

protected override void OnInitialized()
{
    AppState.OnCurrentWikiPageChanged += async () => 
    {
        StateHasChanged();
        await Task.CompletedTask;
    };
    base.OnInitialized();
}

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