Blazor组件页面重载时出现空引用异常问题排查

核心原因分析 #

你遇到的问题本质是异步加载过程中Offers被置为null，且Blazor的异步渲染机制导致if判断与foreach执行之间状态发生了变化：

• 虽然初始时Offers是个空列表，但如果OnInitializedAsync中直接将其赋值为服务返回的结果，而服务返回null，就会把原有的空列表覆盖成null。
• Blazor的UI渲染是异步触发的，可能第一次渲染时Offers非空（通过if判断），但在foreach执行前，异步方法完成并将Offers设为null，此时遍历就会抛出空引用异常。

具体解决方案 #

1. 确保异步加载后Offers永远不为null

修改OnInitializedAsync方法，给服务返回的结果加null兜底：

private List<Offer> Offers = new List<Offer>();

protected override async Task OnInitializedAsync()
{
    // 即使服务返回null，也用空列表兜底
    var fetchedOffers = await _yourOfferService.GetOffersAsync();
    Offers = fetchedOffers ?? new List<Offer>();
}

2. 渲染时缓存Offers的当前引用

在if判断后，先把Offers赋值给局部变量，避免异步更新导致的状态变化：

@if (Offers != null)
{
    var currentOffers = Offers;
    foreach (var offer in currentOffers.Where(o => o != null))
    {
        <!-- 你的Offer渲染代码 -->
        <div>@offer.Name</div>
    }
}

3. 直接在foreach中做null安全处理

用null合并运算符直接处理Offers为null的情况，无需额外if判断：

@foreach (var offer in Offers?.Where(o => o != null) ?? Enumerable.Empty<Offer>())
{
    <!-- 你的Offer渲染代码 -->
}

额外排查点 #

• 确认你的服务方法GetOffersAsync是否真的不会返回null，或者是否在某些异常场景下返回了null。
• 检查是否有其他地方（比如其他生命周期方法、事件回调）修改了Offers的值，导致其变为null。

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