.NET Blazor MAUI Hybrid中如何从XAML页面导航到Blazor页面

方法1：通过依赖注入使用NavigationManager #

• 在XAML页面的代码后台注入NavigationManager：

  private readonly NavigationManager _navigationManager;
  
  public YourXamlPage(NavigationManager navigationManager)
  {
      InitializeComponent();
      _navigationManager = navigationManager;
  }
  

• 在导航触发事件（如按钮点击）中调用路由跳转：

  private void NavigateToRazorBtn_Clicked(object sender, EventArgs e)
  {
      // 替换为目标Razor页面的路由，比如"/Counter"
      _navigationManager.NavigateTo("/Counter");
      // 若XAML页面是弹出的，返回Blazor所在页面
      Navigation.PopAsync();
  }
  

方法2：直接操作BlazorWebView实例 #

如果BlazorWebView在主页面（如MainPage）中，可直接获取实例跳转：

• 在主页面（MainPage.xaml.cs）中公开BlazorWebView实例：

  public BlazorWebView AppBlazorWebView { get; private set; }
  
  public MainPage()
  {
      InitializeComponent();
      AppBlazorWebView = this.BlazorWebView;
  }
  

• 在XAML页面的导航事件中调用：

  private void NavigateToRazorBtn_Clicked(object sender, EventArgs e)
  {
      var mainPage = Application.Current.MainPage as MainPage;
      if (mainPage?.AppBlazorWebView != null)
      {
          mainPage.AppBlazorWebView.NavigateTo("/Counter");
          Navigation.PopAsync();
      }
  }
  

注意事项 #

• 确认目标Razor页面已通过@page "/路由路径"配置正确路由
• 若XAML页面是通过PushAsync打开，跳转后需调用PopAsync回到Blazor宿主页面，否则会停留在XAML页面
• NavigationManager是MAUI Blazor Hybrid默认注册的服务，无需额外配置

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