【MVVM】目的是为了分离视图(View)和模型(Model)的耦合——解耦html
一、View负责前端展现,与ViewModel进行数据和命令的交互。( 双向的数据属性传递,单向的命令属性传递View→ViewModel)
二、ViewModel,负责前端视图业务级别的逻辑结构组织,并将其反馈给前端。
三、Model,主要负责数据实体的结构处理,与ViewModel进行交互。
其实我我的认为,数据和业务交互这一层仍是应该另外独立,Model中彻底就是实体模型,这样更清晰。
新建Prsm Blank App(WPF) 项目:Demo MVVMspa
Views中MainWindow.xaml代码:code
<Window x:Class="DemoMVVM.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"
Title="{Binding Title}" Height="200" Width="300">
<StackPanel>
<TextBox Text="{Binding Input1}" Margin="5,20,5,5" Width="100"/>
<TextBox Text="{Binding Input2}" Margin="5" Width="100"/>
<Button Command="{Binding AddCommand}" Content="求和" Width="75" Margin="5"/>
<TextBox Text="{Binding Result}" Margin="5" Width="100"/>
</StackPanel>
</Window>
ViewModels中MainWindowViewModel.cs代码:其余文件代码不动xml
using Prism.Mvvm;
using Prism.Commands; //引入命令
using System;
//ViewModel为View提供数据属性、命令属性
namespace DemoMVVM.ViewModels
{
public class MainWindowViewModel : BindableBase
{
#region 私有变量,以及对应的属性(习惯大写)
private string _title = "Prism Application";
private double _input1; //默认0
private double _input2;
private double _result;
public double Result //数据属性
{
get { return _result; }
set { _result = value; RaisePropertyChanged("Result"); } //变化结果展现在View界面上
}
public double Input2 //数据属性
{
get { return _input2; }
set { _input2 = value; }
}
public double Input1 //数据属性
{
get { return _input1; }
set { _input1 = value; }
}
public string Title //数据属性
{
get { return _title; }
set { _title = value; }
}
#endregion
#region 命令属性
public DelegateCommand AddCommand { get; set; }
#endregion
public void Add() //方法
{
this.Result = this.Input1 + this.Input2;
}
public MainWindowViewModel() //将方法Add与命令属性AddCommand联系起来
{
this.AddCommand = new DelegateCommand(new Action(Add));
}
}
}
注意:View与ModelView传递的是属性、属性、属性(习惯大写)htm
【实战2】
新建Prsm Blank App(WPF) 项目:BlankApp5
Views中MainWindow.xaml代码:
<Window x:Class="BlankApp5.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"
Title="{Binding Title}" Height="200" Width="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="学号" Margin="20,0" VerticalAlignment="Center"/>
<TextBox Text="{Binding Id}" IsReadOnly="True" Width="200" Padding="2" />
</StackPanel>
<StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="姓名" Margin="20,0" VerticalAlignment="Center"/>
<TextBox Text="{Binding Name}" IsReadOnly="True" Width="200" Padding="2"/>
</StackPanel>
<Button Command="{Binding ShowCommand}" Content="显示" Grid.Row="2" VerticalAlignment="Center" Width="50"/>
</Grid>
</Window>
ViewModels中MainWindowViewModel.cs代码:其余文件代码不动
using Prism.Mvvm;
using Prism.Commands;
using System;
namespace BlankApp5.ViewModels
{
public class MainWindowViewModel : BindableBase
{
#region 私有变量,以及对应的属性(习惯大写)
private string _title = "Prism Application";
private string _name;
private string _id;
public string Id
{
get { return _id; }
set { _id = value; RaisePropertyChanged("Id"); }
}
public string Name
{
get { return _name; }
set { _name = value; RaisePropertyChanged("Name"); }
}
public string Title
{
get { return _title; }
set { _title=value; }
}
#endregion
#region 命令属性
public DelegateCommand ShowCommand { get; set; }
#endregion
public void Show() //方法
{
this.Name = "夕西行";
this.Id = "20190809";
}
public MainWindowViewModel() //命令属性与方法联系起来
{
this.ShowCommand = new DelegateCommand(new Action(Show));
}
}
}
MainWindow.xaml.cs代码:贴出来只是有疑问,大神可解答下
using System.Windows;
using BlankApp5.ViewModels;
namespace BlankApp5.Views
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
//this.DataContext = new MainWindowViewModel(); //这句有无貌似没什么影响,懂得大神能够留言讲下
}
}
}