.NET 8 Blazor Web App中Blazored Modal无法关闭问题求助

核心问题：异步事件处理方法使用async void #

你的调用组件中ShowDialog方法采用了async void作为返回类型，这是Blazor组件开发中的错误用法。Blazor要求异步事件处理方法必须返回async Task，async void会导致框架无法跟踪异步操作的完整生命周期，进而引发模态框实例重复创建——每次点击"Show"按钮都会生成一个新的模态框叠加在旧实例之上，因此需要点击四次才能关闭所有叠加的模态框，背景遮罩逐渐变浅是多个半透明遮罩层叠加的视觉效果。

修复方案 #

修改调用组件的ShowDialog方法，将返回类型从async void改为async Task：

private async Task ShowDialog()
{
    var parameters = new ModalParameters()
        .Add(nameof(Dialog.Message), Message);
    
    var dialogModalReference = ModalService.Show<Dialog>(parameters);
    var result = await dialogModalReference.Result;

    if (!result.Confirmed) return;
    if (Model != null)
       // 执行你的业务逻辑
}

额外验证项 #

• 确认App.razor中CascadingBlazoredModal仅注册一次：当前你的App.razor结构正确，但需避免在MainLayout或其他子布局中重复添加CascadingBlazoredModal，否则会导致模态框服务重复注册，引发叠加问题。
• 检查Dialog组件的关闭逻辑：你的Confirm和Cancel方法调用CloseAsync、CancelAsync的写法符合官方规范，无需调整。

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