.NET MAUI中如何在一处动态切换显示多个组件？

1. ViewModel中定义可绑定的视图属性 #

先确保你的ViewModel实现INotifyPropertyChanged接口，再添加存储视图实例的属性：

public class ParentViewModel : INotifyPropertyChanged
{
    private UIElement _currentView;
    public UIElement CurrentView
    {
        get => _currentView;
        set
        {
            _currentView = value;
            OnPropertyChanged(nameof(CurrentView));
        }
    }

    // 根据状态切换视图的方法，按业务逻辑调整
    public void SwitchView(int state)
    {
        switch (state)
        {
            case 1:
                CurrentView = new ViewComponentA(); // 替换为你的第一个组件类型
                break;
            case 2:
                CurrentView = new ViewComponentB(); // 替换为你的第二个组件类型
                break;
            case 3:
                CurrentView = new ViewComponentC(); // 替换为你的第三个组件类型
                break;
        }
    }

    // INotifyPropertyChanged标准实现
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

2. XAML中用ContentControl渲染动态视图 #

在父视图的XAML里，通过ContentControl绑定ViewModel的CurrentView属性，它会自动渲染绑定的视图实例：

<Window x:Class="YourNamespace.ParentView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:YourNamespace">
    <Window.DataContext>
        <local:ParentViewModel />
    </Window.DataContext>

    <!-- 核心：用ContentControl承载动态视图 -->
    <ContentControl Content="{Binding CurrentView}" />
</Window>

3. 额外注意事项 #

• 如果子视图需要绑定自身的ViewModel，创建实例时记得设置DataContext：

  CurrentView = new ViewComponentA { DataContext = new ViewAViewModel() };
  

• 更规范的MVVM写法：ViewModel不直接持有View实例，而是存储子ViewModel，通过DataTemplate映射类型。示例：

  <Window.Resources>
      <DataTemplate DataType="{x:Type local:ViewAViewModel}">
          <local:ViewComponentA />
      </DataTemplate>
      <DataTemplate DataType="{x:Type local:ViewBViewModel}">
          <local:ViewComponentB />
      </DataTemplate>
  </Window.Resources>
  

  此时CurrentView属性类型改为object或基类ViewModel，切换时赋值对应的子ViewModel，ContentControl会自动匹配DataTemplate渲染视图。

内容的提问来源于stack exchange，提问作者Radek Sedlář