WPF MVVM 多个不同Model实例绑定

1.创建WPF应用，并创建如下项目

其中Usercontrol要实现命令的绑定，我这里是直接使用Nuget安装System.Windows.Interactivity.WPF这个包。并且引用程序集PresentationCore.dll(不引用该程序集会是的有些我们需要类无法识别,例如CommandManager)。

2.创建控件UserControl。本文只为了完成同一控件类型绑定不同的Model实例，故只简单的写了一个名称和密码框。代码如下:

<UserControl x:Class="WpfMVVM.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfMVVM"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300" FontFamily="Consolas">
    <StackPanel Margin="0">
        <StackPanel.Resources>
            <Style TargetType="StackPanel">
                <Setter Property="Margin" Value="20,20,0,0">
                    
                </Setter>
            </Style>
        </StackPanel.Resources>
        <StackPanel Orientation="Horizontal">
            <TextBlock Width="70">Name:</TextBlock>
            <TextBox Width="120" Text="{Binding Name}"></TextBox>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <TextBlock Width="70">Password:</TextBlock>
            <TextBox Width="120" Text="{Binding Password}"></TextBox>
        </StackPanel>
        <Button Width="90" Margin="60,20,0,0" Command="{Binding SureClick}">
            <TextBlock>确认</TextBlock>
        </Button>
    </StackPanel>
</UserControl>

3.再主界面添加两个这样的用户控件。

<Window x:Class="WpfMVVM.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfMVVM"
        xmlns:uVM="clr-namespace:UserControlVM;assembly=UserControlVM"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525"
        >
    <StackPanel>
        <local:UserControl1 x:Name="view1">
        </local:UserControl1>
        <local:UserControl1 x:Name="view2">
        </local:UserControl1>
    </StackPanel>
</Window>

显示如下：

分别命名第一个与第二个控件的名称为view1与view2。

3.ModelView的创建

View与ViewModel的构建原理这里就不详细介绍，这里主要是完成绑定不同的Model。直接给出代码

  public class UserVM:INotifyPropertyChanged
    {
        UserModel User = new UserModel();
        public UserVM(UserModel user)
        {
            User = user;
        }
        public string Name
        {
            get { return User.Name; }
            set
            {
                User.Name = value;
                PropertyChanged(this, new PropertyChangedEventArgs(nameof(Name)));
            }
        }
        public string Password
        {
            get { return User.Password; }
            set
            {
                User.Password = value;
                PropertyChanged(this, new PropertyChangedEventArgs(nameof(Password)));
            }
        }
        public ICommand SureClick => new Command(Sure);
        private void Sure()
        {
        }
        public event PropertyChangedEventHandler PropertyChanged;
    }

应该能注意到，UserVM的构造函数是需要传入一个Model的，这里就实现了不同的Model构建不同的ViewModel。然后创建一个单例的类来实例化ViewModel：

 public class VMInstance
    {
        private static VMInstance _VMInstance = new VMInstance();
        public UserVM UserVM1 { get; set; } 
        public UserVM UserVM2 { get; set; }
        public VMInstance()
        {
            UserVM1 = new UserVM(Model.ModelInstance.GetVMInstance().UserModel1);
            UserVM2 = new UserVM(Model.ModelInstance.GetVMInstance().UserModel2);
        }
        public static VMInstance GetVMInstance()
        {
            return _VMInstance;
        }
    }

而Model也是用这种方式来实例化：

  public class ModelInstance
    {
        private static ModelInstance _ModelInstance = new ModelInstance();
        public UserModel UserModel1 { get; set; } = new UserModel();
        public UserModel UserModel2 { get; set; } = new UserModel();
        private ModelInstance()
        {
            UserModel1.Name = "qqq";
            UserModel1.Password = "123";
            UserModel2.Name = "yyy";
            UserModel2.Password = "234";
        }
        public static ModelInstance GetVMInstance()
        {
            return _ModelInstance;
        }

4.最终的绑定

直接在MainWidow构造函数那绑定

  public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.view1.DataContext = VMInstance.GetVMInstance().UserVM1;
            this.view2.DataContext = VMInstance.GetVMInstance().UserVM2;
        }
    }

F5运行

当然也可以不采用这种方式，你可以通过继承的方式来绑定，获得不一样的Viewmodel拿来绑定View。