WPF MVVM视图切换问题求助：附代码示例及多技术疑问

1. 无法实现视图切换的解决方法 #

当前代码无法切换视图的核心问题有两个：

• 视图硬编码DataContext：Page1View和Page2View内部直接创建了自身VM的实例并设置为DataContext，导致ContentControl绑定的CurrentVM无法传递给视图。
• 缺少VM与View的关联规则：WPF不知道如何将ViewModel渲染为对应的View，ContentControl只会显示VM的字符串表示。

解决步骤：

1. 移除所有View中的<UserControl.DataContext>节点，让ContentControl自动将CurrentVM作为视图的DataContext：

   <!-- Page1View修改后 -->
   <UserControl>
       <Grid>
           <!-- 原有布局代码保留 -->
       </Grid>
   </UserControl>
   

2. 添加DataTemplate关联VM与View（见问题2的详细实现），让WPF明确ViewModel对应的渲染视图。

2. 使用DataTemplate并避免重复创建View #

步骤1：定义DataTemplate #

在App.xaml或MainWindow.xaml的资源中添加DataTemplate，无需设置x:Key，WPF会根据ViewModel的类型自动匹配：

<!-- App.xaml示例 -->
<Application.Resources>
    <DataTemplate DataType="{x:Type vm:Page1VM}">
        <view:Page1View />
    </DataTemplate>
    <DataTemplate DataType="{x:Type vm:Page2VM}">
        <view:Page2View />
    </DataTemplate>
</Application.Resources>

注意：需在XAML顶部添加对应命名空间声明，比如xmlns:vm="clr-namespace:Step3_1.ViewModels.Page1"、xmlns:view="clr-namespace:Step3_1.Views"（假设View放在Views文件夹）。

步骤2：缓存View实例避免重复创建 #

默认情况下，每次切换VM时WPF会创建新的View实例。要实现首次创建后复用，可在MainWindowVM中维护一个View缓存字典：

namespace Step3_1.ViewModels
{
    public class MainWindowVM : ViewModelBase
    {
        private object _currentVM;
        public object CurrentVM
        {
            get => _currentVM;
            set { _currentVM = value; OnPropertyChanged(); }
        }

        private Page1.Page1VM _page1VM;
        private Page2.Page2VM _page2VM;
        // 缓存View实例的字典
        private readonly Dictionary<Type, UIElement> _viewCache = new();

        public ICommand Page1Command { get; set; }
        public ICommand Page2Command { get; set; }

        public MainWindowVM()
        {
            InitializeVM();
            SwitchToFirstView();
        }

        private void InitializeVM()
        {
            _page1VM = new Page1.Page1VM();
            _page2VM = new Page2.Page2VM();

            Page1Command = new RelayCommand<object>(_ => SwitchView(_page1VM));
            Page2Command = new RelayCommand<object>(_ => SwitchView(_page2VM));
        }

        private void SwitchView(object viewModel)
        {
            var viewModelType = viewModel.GetType();
            // 检查缓存中是否已有对应的View
            if (!_viewCache.TryGetValue(viewModelType, out var view))
            {
                // 首次创建View并绑定DataContext
                view = viewModelType switch
                {
                    Type t when t == typeof(Page1.Page1VM) => new Views.Page1View { DataContext = _page1VM },
                    Type t when t == typeof(Page2.Page2VM) => new Views.Page2View { DataContext = _page2VM },
                    _ => throw new ArgumentException("未知ViewModel类型")
                };
                _viewCache.Add(viewModelType, view);
            }
            // 直接设置ContentControl的Content为缓存的View
            CurrentVM = view;
        }

        private void SwitchToFirstView()
        {
            SwitchView(_page1VM);
        }
    }
}

同时修改MainWindow中的ContentControl绑定（此时CurrentVM存储的是View实例）：

<DockPanel Grid.Row="1">
    <ContentControl Content="{Binding CurrentVM}"/>
</DockPanel>

3. 除DataTemplate外的常用实现方式 #

• Frame导航：使用WPF自带的Frame控件，通过导航到不同的Page实例或Uri实现切换，适合页面级别的导航：

  <Frame x:Name="MainFrame" Grid.Row="1"/>
  

  在VM中通过命令调用MainFrame.Navigate(new Page1View());（可通过接口解耦VM与View的直接依赖）。
• Visibility切换：预先将所有View放置在界面上，通过绑定Visibility属性控制显示/隐藏，适合少量视图的场景：

  <Grid Grid.Row="1">
      <view:Page1View Visibility="{Binding IsPage1Visible, Converter={StaticResource BooleanToVisibilityConverter}}"/>
      <view:Page2View Visibility="{Binding IsPage2Visible, Converter={StaticResource BooleanToVisibilityConverter}}"/>
  </Grid>
  

• 第三方框架：如Prism的RegionManager、Caliburn.Micro的ViewLocator，适合复杂项目的模块化视图管理。

4. WPF MVVM视图切换最简示例 #

核心文件实现 #

基础ViewModel基类

using System.ComponentModel;
using System.Runtime.CompilerServices;

public class ViewModelBase : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

极简RelayCommand

using System;
using System.Windows.Input;

public class RelayCommand<T> : ICommand
{
    private readonly Action<T> _execute;
    private readonly Func<T, bool> _canExecute;

    public RelayCommand(Action<T> execute, Func<T, bool> canExecute = null)
    {
        _execute = execute ?? throw new ArgumentNullException(nameof(execute));
        _canExecute = canExecute;
    }

    public bool CanExecute(object parameter) => _canExecute?.Invoke((T)parameter) ?? true;
    public void Execute(object parameter) => _execute((T)parameter);
    public event EventHandler CanExecuteChanged
    {
        add => CommandManager.RequerySuggested += value;
        remove => CommandManager.RequerySuggested -= value;
    }
}

两个简单ViewModel

public class HomeVM : ViewModelBase
{
    public string Title => "首页视图";
}

public class SettingsVM : ViewModelBase
{
    public string Title => "设置视图";
}

对应View

<!-- HomeView.xaml -->
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <TextBlock Text="{Binding Title}" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</UserControl>

<!-- SettingsView.xaml -->
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <TextBlock Text="{Binding Title}" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</UserControl>

主窗口ViewModel

public class MainVM : ViewModelBase
{
    private object _currentView;
    public object CurrentView
    {
        get => _currentView;
        set { _currentView = value; OnPropertyChanged(); }
    }

    public ICommand HomeCommand { get; }
    public ICommand SettingsCommand { get; }

    public MainVM()
    {
        CurrentView = new HomeVM();
        HomeCommand = new RelayCommand<object>(_ => CurrentView = new HomeVM());
        SettingsCommand = new RelayCommand<object>(_ => CurrentView = new SettingsVM());
    }
}

主窗口XAML

<Window x:Class="SimpleViewSwitch.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:vm="clr-namespace:SimpleViewSwitch"
        xmlns:views="clr-namespace:SimpleViewSwitch.Views"
        Title="视图切换示例" Height="450" Width="800">
    <Window.DataContext>
        <vm:MainVM/>
    </Window.DataContext>
    <Window.Resources>
        <DataTemplate DataType="{x:Type vm:HomeVM}">
            <views:HomeView/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type vm:SettingsVM}">
            <views:SettingsView/>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition/>
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
            <Button Content="首页" Command="{Binding HomeCommand}" Width="100" Margin="5"/>
            <Button Content="设置" Command="{Binding SettingsCommand}" Width="100" Margin="5"/>
        </StackPanel>

        <ContentControl Grid.Row="1" Content="{Binding CurrentView}"/>
    </Grid>
</Window>

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