Blazor级联参数传值未调用StateHasChanged时取值为null问题

问题复现 #

两个组件通过级联参数传递状态：

1. 作为状态容器的根组件代码：

   <CascadingValue Value="this">
       @ChildContent
   </CascadingValue>
   
   @code{ 
   [Parameter] public RenderFragment? ChildContent { get; set; }
   public Debtor? CurrentDebtor { get; private set; }
   
   public async Task<Debtor> ConsolitdateCurrentDebtor(int debtorID)
   {
       Debtor? currentDebtor = null;
   
       if (DebtorStoreList != null && DebtorStoreList.Count > 0)
       {
           currentDebtor = DebtorStoreList.Where(d => d.ID == debtorID).Single();
       }
       else
       {
           currentDebtor = await _debtorService.GetDebtorInformation();
       }
   
       CurrentDebtor = currentDebtor;
       // 注释掉StateHasChanged时下游组件拿不到更新值
       // StateHasChanged();
       return currentDebtor;
     }
   }
   

2. 下游消费级联值的组件代码：

   @code {
   Debtor? debtor;
   
   [CascadingParameter]
   AppState AppState{ get; set; }
   
   protected override async Task OnInitializedAsync()
    {
       debtor = AppState.CurrentDebtor;
    }
   }
   

实际运行时下游组件读取到的AppState.CurrentDebtor始终为null，只有在CurrentDebtor赋值后手动调用StateHasChanged()才能获取正确值，需要无需强制调用该方法的实现方案。

根本原因 #

Blazor的级联参数默认使用引用相等性判断值是否发生变更：

• 你通过Value="this"传递的是状态容器组件的实例引用，修改实例内部的CurrentDebtor属性时，实例本身的引用没有发生变化，Blazor检测不到级联值更新，不会触发下游组件的重新渲染。
• 下游组件在OnInitializedAsync生命周期仅执行一次本地变量赋值，后续状态变更时没有逻辑同步更新本地变量，自然会一直拿到null值。

推荐实现方案 #

方案1：抽离独立状态类+变更通知（无耦合，无需手动触发组件渲染） #

不要把组件本身作为级联值传递，将状态逻辑从组件中抽离为独立的状态类，实现INotifyPropertyChanged接口发送变更通知，级联时标记IsFixed="true"（表示级联值引用固定不变，减少Blazor的变更检测开销）。

1. 独立状态类代码：

   using System.ComponentModel;
   using System.Runtime.CompilerServices;
   
   public class AppState : INotifyPropertyChanged
   {
       private Debtor? _currentDebtor;
       public Debtor? CurrentDebtor
       {
           get => _currentDebtor;
           private set => SetField(ref _currentDebtor, value);
       }
   
       private readonly IDebtorService _debtorService;
       public List<Debtor>? DebtorStoreList { get; set; }
   
       public AppState(IDebtorService debtorService)
       {
           _debtorService = debtorService;
       }
   
       public async Task<Debtor> ConsolitdateCurrentDebtor(int debtorID)
       {
           Debtor? currentDebtor = null;
           if (DebtorStoreList != null && DebtorStoreList.Count > 0)
           {
               currentDebtor = DebtorStoreList.First(d => d.ID == debtorID);
           }
           else
           {
               currentDebtor = await _debtorService.GetDebtorInformation();
           }
           CurrentDebtor = currentDebtor;
           return currentDebtor;
       }
   
       public event PropertyChangedEventHandler? PropertyChanged;
   
       protected virtual void OnPropertyChanged([CallerMemberName] string? propertyName = null)
       {
           PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
       }
   
       protected bool SetField<T>(ref T field, T value, [CallerMemberName] string? propertyName = null)
       {
           if (EqualityComparer<T>.Default.Equals(field, value)) return false;
           field = value;
           OnPropertyChanged(propertyName);
           return true;
       }
   }
   

2. 状态容器组件简化为纯承载组件：

   @inject AppState AppState
   <CascadingValue Value="AppState" IsFixed="true">
       @ChildContent
   </CascadingValue>
   
   @code{
       [Parameter] public RenderFragment? ChildContent { get; set; }
   }
   

3. 下游消费组件订阅状态变更事件自动刷新，不要在初始化时一次性赋值本地变量：

   @implements IDisposable
   
   <!-- 直接绑定状态属性即可自动更新 -->
   <p>当前债务人：@AppState.CurrentDebtor?.Name</p>
   
   @code {
       [CascadingParameter]
       public AppState AppState { get; set; } = default!;
   
       protected override void OnInitialized()
       {
           // 订阅状态变更，自动触发组件刷新
           AppState.PropertyChanged += HandleStateChange;
       }
   
       private void HandleStateChange(object? sender, PropertyChangedEventArgs e)
       {
           InvokeAsync(StateHasChanged);
       }
   
       public void Dispose()
       {
           // 组件销毁时取消订阅，避免内存泄漏
           AppState.PropertyChanged -= HandleStateChange;
       }
   }
   

该方案下状态逻辑和UI组件完全解耦，修改状态属性时会自动发送通知，所有订阅的组件都会自动刷新，不需要在状态修改处手动调用StateHasChanged()。

方案2：DI注册全局状态（适合全局共享场景） #

如果AppState是全局共享的状态，可以直接将其注册为Scoped生命周期服务（Blazor WASM注册为Singleton即可），不需要套CascadingValue组件，下游组件直接通过@inject AppState AppState获取实例，同样配合上面的属性变更通知实现自动刷新，代码更简洁。

不推荐方案 #

保留原有传递组件实例的写法，每次修改CurrentDebtor后手动调用容器组件的StateHasChanged()，也就是你现在使用的方式。该方案状态逻辑和组件强耦合，一旦漏写StateHasChanged()就会出现状态不更新的问题，维护成本高。

避坑提示 #

不要在生命周期方法中一次性将级联参数的属性赋值给本地变量，这种写法无法感知后续的状态变更，要么直接绑定级联参数的属性，要么通过变更通知同步更新本地变量。

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