Blazor Web App客户端使用NavigationManager抛出异常问题排查

1. 确认Weather组件的路由注册 #

检查Client项目中Weather.razor的顶部是否添加了路由指令：

@page "/weather"

如果缺少这个指令，Router无法识别该路由，调用NavigateTo会触发异常。

2. 确保组件使用正确的交互渲染模式 #

在Home.razor顶部添加渲染模式声明，保证NavigationManager在交互环境下正常工作：

@rendermode InteractiveWebAssembly
@inject NavigationManager NavigationManager

或者在App.razor中全局设置交互式渲染模式，覆盖所有组件：

<Routes @rendermode="InteractiveWebAssembly" />

3. 调整导航触发时机 #

OnInitialized是同步生命周期方法，此时Blazor的导航系统可能尚未完全初始化，导致调用NavigateTo失败。将导航逻辑移至OnAfterRenderAsync，并通过firstRender确保仅执行一次：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        NavigationManager.NavigateTo("/weather");
    }
}

4. 修正Routes.razor的程序集配置 #

Client项目的Routes.razor中，AdditionalAssemblies应该指向包含组件的程序集，而非_Imports文件（它只是导入声明，不包含组件）。如果Weather组件在Client项目内，可简化配置：

<Router AppAssembly="typeof(Program).Assembly">
    <Found Context="routeData">
        <RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" />
        <FocusOnNavigate RouteData="routeData" Selector="h1" />
    </Found>
</Router>

若组件在其他项目，再指定对应程序集，比如typeof(OtherProject.Weather).Assembly。

5. 验证Server端Program.cs的程序集配置 #

Server项目的Program.cs中，AddAdditionalAssemblies应指向Client项目中包含组件的程序集，而非_Imports：

app.MapRazorComponents<App>()
        .AddInteractiveWebAssemblyRenderMode()
        .AddAdditionalAssemblies(typeof(BlazorApp1.Client.Weather).Assembly);

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