Blazor应用中ErrorBoundary组件无法显示的问题求助

你的ErrorBoundary无法显示错误内容，核心原因有两个：

1. 重复渲染@Body导致错误边界未生效 #

你的MainLayout里同时在两个区域渲染了@Body：一个在FluentBodyContent的<div class="content">内部，另一个在独立的<article>标签里的ErrorBoundary中。页面组件抛出错误时，实际是第一个未被错误边界包裹的@Body触发了全局错误，你设置的ErrorBoundary并没有真正覆盖到抛出错误的组件。

2. 错误边界被自动强制重置 #

在OnParametersSet方法中，你每次都会调用errorBoundary?.Recover()，这意味着只要组件参数发生变化（包括错误触发后的组件重渲染），错误边界就会立即恢复初始状态，导致错误内容刚要渲染就被清空。

修正后的代码 #

将ErrorBoundary整合到布局的正确位置，移除重复的@Body渲染，并调整错误恢复逻辑：

@inherits LayoutComponentBase

<FluentLayout>
    <FluentHeader>
        -----
    </FluentHeader>
    <FluentStack Class="main" Orientation="Orientation.Horizontal" Width="100%">
        <NavMenu />
        <FluentBodyContent Class="body-content">
            <div class="content">
                <!-- 仅保留被ErrorBoundary包裹的@Body，确保所有页面内容都被错误边界覆盖 -->
                <ErrorBoundary @ref="errorBoundary">
                    <ChildContent>
                        @Body
                    </ChildContent>
                    <ErrorContent>
                        <div class="errorUI">
                            <p>😈 A rotten gremlin got us. Sorry!</p>
                            <!-- 添加手动恢复按钮，替代自动恢复逻辑 -->
                            <button @onclick="() => errorBoundary?.Recover()">Try again</button>
                        </div>
                    </ErrorContent>
                </ErrorBoundary>
            </div>
        </FluentBodyContent>
    </FluentStack>
    <FluentFooter>
        <a href="https://www.fluentui-blazor.net" target="_blank">Documentation and demos</a>
        <FluentSpacer />
        <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor" target="_blank">About Blazor</a>
    </FluentFooter>
</FluentLayout>

@code {
    private ErrorBoundary? errorBoundary;

    // 移除OnParametersSet中的自动Recover调用
    // 若需路由切换时自动恢复错误边界，可添加导航监听（可选）：
    // [Inject] NavigationManager NavManager { get; set; }
    // 
    // protected override void OnInitialized()
    // {
    //     NavManager.LocationChanged += (s, e) => errorBoundary?.Recover();
    // }
}

关键说明 #

• 确保所有页面内容都被ErrorBoundary包裹，避免重复渲染@Body导致错误边界失效。
• 禁止在OnParametersSet中自动调用Recover，该方法会在组件参数变化（包括错误触发后的重渲染）时频繁执行，直接打断错误内容的展示。
• 通过手动按钮触发错误边界恢复，或监听路由导航事件在页面切换时自动恢复，既符合用户操作逻辑，也能保证错误内容正常展示。

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