面向Windows平台的MAUI Blazor应用如何设置窗口标题？

你截图中配置的ContentPage.Title属性在MAUI Blazor项目中不会生效，原因是MAUI Blazor的窗口标题默认由内嵌的Blazor WebView的页面标题接管，优先级高于XAML页面的Title配置。

解决方案 #

• 方案1：静态修改全局窗口标题
  直接修改项目wwwroot/index.html文件中的<title>标签内容即可，示例：

  <head>
      <meta charset="utf-8" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <title>自定义应用标题</title>
      <!-- 其他头部配置 -->
  </head>
  

  重新编译运行后窗口标题就会更新为你设置的值。

• 方案2：动态修改窗口标题
  如果需要在运行时动态切换标题，可以调用Blazor的JS互操作修改页面标题，示例代码：

  // 在razor组件中注入IJSRuntime
  @inject IJSRuntime JSRuntime
  
  // 需要修改标题时调用
  private async Task ChangeTitle(string newTitle)
  {
      await JSRuntime.InvokeVoidAsync("eval", $"document.title = '{newTitle}'");
  }
  

  如果你使用的Blazor版本已经支持PageTitle组件，也可以直接在任意razor组件中使用该组件动态设置标题：

  <PageTitle>动态设置的新标题</PageTitle>
  

• 方案3：通过Windows平台原生API修改
  如果你希望完全脱离Blazor WebView的标题控制，可以在Windows平台专属代码中直接修改原生窗口标题，编辑Platforms/Windows/App.xaml.cs文件，添加如下代码：

  protected override void OnLaunched(LaunchActivatedEventArgs args)
  {
      base.OnLaunched(args);
      
      var windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(this);
      var windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(windowHandle);
      var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
      // 设置自定义标题
      appWindow.Title = "自定义窗口标题";
  }
  

  该方案修改的是原生WinUI窗口的标题，优先级最高，不会被Blazor侧的标题配置覆盖。

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