WPF Blazor Hybrid中从Blazor代码访问父XAML窗口及ViewModel的最优方法

针对你开发的WPF-Blazor Hybrid应用，需要从Blazor的MainBlazor布局/页面访问宿主XAML窗口及其ViewModel的场景，以下是几种落地性强、符合架构设计的方案，按推荐优先级排序：

方法一：依赖注入共享ViewModel（最推荐） #

这是解耦度最高的方案，完全贴合MVVM和Blazor的设计理念：

1. 将XAML窗口的ViewModel注册为单例/作用域服务（根据生命周期需求选择）：

   // 在App.xaml.cs或服务注册类中配置
   services.AddSingleton<MainWindowViewModel>();
   

2. XAML窗口绑定该ViewModel实例：

   <!-- MainWindow.xaml -->
   <Window.DataContext>
       <local:MainWindowViewModel />
   </Window.DataContext>
   

   或在代码后台通过DI直接获取实例：

   // MainWindow.xaml.cs构造函数
   public MainWindow(MainWindowViewModel vm)
   {
       InitializeComponent();
       DataContext = vm;
   }
   

3. 在Blazor组件（MainBlazor）中直接注入ViewModel使用：

   @inject MainWindowViewModel WindowVm
   
   <!-- 直接调用ViewModel的属性/方法 -->
   <button @onclick="() => WindowVm.ExecuteWindowAction()">触发窗口ViewModel逻辑</button>
   

方法二：通过RootComponent传递引用（适合简单场景） #

若不想依赖DI，可直接将XAML窗口或ViewModel的引用传递给Blazor组件：

1. 修改你提供的XAML代码，为RootComponent添加参数：

   <blazor:BlazorWebView HostPage="wwwroot\index.html" Services="{DynamicResource services}">
       <blazor:BlazorWebView.RootComponents>
           <blazor:RootComponent Selector="#app" ComponentType="{x:Type local:MainRouter}">
               <blazor:RootComponent.Parameters>
                   <x:String x:Key="ParentWindow">{Binding RelativeSource={RelativeSource AncestorType=Window}}</x:String>
                   <x:String x:Key="ParentVm">{Binding}</x:String>
               </blazor:RootComponent.Parameters>
           </blazor:RootComponent>
       </blazor:BlazorWebView.RootComponents>
   </blazor:BlazorWebView>
   

2. 在你提供的MainRouter中接收参数，再传递给MainBlazor：

   @using BlazorHybrid.WPF.Views.BlazorComponents.Shared
   @using Microsoft.AspNetCore.Components.Routing
   
   @code {
       [Parameter] public Window ParentWindow { get; set; }
       [Parameter] public MainWindowViewModel ParentVm { get; set; }
   }
   
   <Router AppAssembly="@typeof(MainRouter).Assembly">
       <Found Context="routeData">
           <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainBlazor)">
               <RouteView.Parameters>
                   <Parameter Name="ParentWindow" Value="@ParentWindow" />
                   <Parameter Name="ParentVm" Value="@ParentVm" />
               </RouteView.Parameters>
           </RouteView>
           <FocusOnNavigate RouteData="@routeData" Selector="h1" />
       </Found>
       <NotFound>
           <LayoutView Layout="@typeof(MainBlazor)">
               <p role="alert">抱歉，该地址不存在内容。</p>
           </LayoutView>
       </NotFound>
   </Router>
   

3. 在MainBlazor中接收参数并使用：

   @code {
       [Parameter] public Window ParentWindow { get; set; }
       [Parameter] public MainWindowViewModel ParentVm { get; set; }
   
       private void MinimizeWindow()
       {
           ParentWindow.WindowState = WindowState.Minimized;
       }
   }
   

方法三：静态事件总线（适合跨组件消息传递） #

若仅需单向通知或简单交互，可使用事件总线实现解耦：

1. 创建静态事件总线类：

   public static class AppEventBus
   {
       public static event Action<string> OnBlazorMessageReceived;
   
       public static void SendBlazorMessage(string message)
       {
           OnBlazorMessageReceived?.Invoke(message);
       }
   }
   

2. 在XAML窗口的ViewModel中订阅事件：

   public MainWindowViewModel()
   {
       AppEventBus.OnBlazorMessageReceived += HandleBlazorEvent;
   }
   
   private void HandleBlazorEvent(string message)
   {
       switch(message)
       {
           case "MaximizeWindow":
               Application.Current.MainWindow.WindowState = WindowState.Maximized;
               break;
       }
   }
   

3. 在Blazor组件中发送事件：

   <button @onclick="() => AppEventBus.SendBlazorMessage("MaximizeWindow")">最大化窗口</button>
   

注意事项 #

• 优先通过ViewModel交互，避免直接操作XAML窗口实例，符合MVVM原则
• 使用DI时需注意ViewModel的生命周期，避免内存泄漏
• 调用WPF特定API（如窗口操作）时，需确保在WPF线程执行，可使用Dispatcher.Invoke

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