通过Blazor组件实例更改状态报错：The render handle is not yet assigned

问题原因 #

你遇到的异常根源是注入的PopMessage实例与页面上<PopMessage/>渲染的实例并非同一个：

• 通过builder.Services.AddScoped<PopMessage>()注册的是独立的类实例，该实例未经过Blazor组件的初始化渲染流程，没有分配渲染句柄（render handle），因此调用StateHasChanged()时会触发异常。
• 页面上的<PopMessage/>是由Blazor渲染引擎创建的组件实例，拥有完整的生命周期，但你并未对这个实例进行操作。

解决方案1：通过@ref获取组件实例（适合局部组件调用） #

直接获取页面上已渲染的组件实例，无需依赖服务注入：

修改Home.razor代码 #

@page "/"
<button @onclick="PopPrint">Pop message</button>
<PopMessage @ref="_popMessage"/>

@code{
    private PopMessage _popMessage;

    private void PopPrint()
    {
        _popMessage.PopShow();
    }
}

移除服务注册 #

删除builder.Services.AddScoped<PopMessage>()代码，组件实例由Blazor直接管理，无需注册为服务。

解决方案2：使用全局消息服务（适合全局通知场景） #

若需在多个组件中触发消息显示，推荐通过独立服务类的事件通知组件更新，更符合Blazor设计模式：

1. 创建MessageService服务类 #

public class MessageService
{
    // 定义消息显示事件
    public event Action OnShowMessage;

    // 触发消息显示的方法
    public void ShowMessage()
    {
        OnShowMessage?.Invoke();
    }
}

2. 注册服务 #

在Program.cs中添加服务注册：

builder.Services.AddScoped<MessageService>();

3. 修改PopMessage.razor组件 #

@if (isDisplay)
{
    <div>
       <span>Message</span>
    </div>
}

@inject MessageService _messageService
@implements IDisposable

@code{
    private bool isDisplay = false;

    protected override void OnInitialized()
    {
        // 订阅消息显示事件
        _messageService.OnShowMessage += HandleShowMessage;
    }

    private void HandleShowMessage()
    {
        isDisplay = true;
        StateHasChanged();
    }

    // 组件销毁时取消订阅，避免内存泄漏
    public void Dispose()
    {
        _messageService.OnShowMessage -= HandleShowMessage;
    }
}

4. 修改Home.razor调用服务 #

@page "/"
@inject MessageService _messageService
<button @onclick="PopPrint">Pop message</button>
<PopMessage/>

@code{
    private void PopPrint()
    {
        _messageService.ShowMessage();
    }
}

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