ASP.NET Core Blazor 路由导航中的组件重渲染问题解析

在 ASP.NET Core Blazor WebAssembly 项目中，开发人员在使用 Router 组件的 Navigating 内容时可能会遇到一个值得注意的行为：当导航到相同页面但参数不同时，整个视图会被重新初始化而非仅更新参数。本文将深入分析这一现象的原因及解决方案。

问题现象

当开发者在 Router 组件中使用 Navigating 内容时，如以下代码示例：

<Router AppAssembly="@typeof(Program).Assembly">
    <Navigating>
        <p>正在加载...</p>
    </Navigating>
    ...
</Router>

此时如果进行页面内导航（即导航到相同组件但参数不同），会出现以下行为：

1. 当前组件会被完全卸载
2. 触发组件的 OnInitialized 生命周期方法
3. 整个组件重新渲染

而如果不使用 Navigating 内容，则只会触发 OnParametersSet 方法，实现更高效的参数更新。

技术原理

这一行为实际上是 Blazor 路由系统的设计特性。当 Navigating 内容被渲染时：

1. 路由系统会先移除当前页面组件
2. 显示 Navigating 内容（如加载指示器）
3. 加载新页面（即使是相同组件）

这种设计确保了导航过程中的视觉连续性，但也带来了额外的渲染开销。

优化方案

对于需要频繁更新参数的场景，开发者可以采用以下策略优化性能：

方案一：条件性显示 Navigating 内容

通过比较当前路径和目标路径，决定是否显示加载状态：

private bool shouldShowLoading(string currentPath, NavigationContext context)
{
    return !context.Path.Equals(currentPath, StringComparison.OrdinalIgnoreCase);
}

方案二：自定义导航处理

创建自定义导航服务，在参数更新时跳过组件重初始化：

public class CustomNavigationService
{
    public async Task NavigateToSamePage(string newParams)
    {
        // 直接更新参数而不触发完整导航
    }
}

最佳实践建议

1. 对于参数频繁更新的页面，考虑不使用 Navigating 内容
2. 如果必须显示加载状态，实现路径比较逻辑
3. 复杂场景下可考虑状态管理解决方案（如 Flux/Redux 模式）
4. 对于性能敏感的应用，进行导航性能测试

理解这一行为有助于开发者在 Blazor 应用中实现更流畅的导航体验，特别是在需要处理大量参数更新的业务场景中。