自己做网站的流程视频教程信息流优化师工作内容

一、MVVM的基本概念

MVVM的基本概念：Model、View、ViewModel

组件	职责	示例内容
Model	封装业务数据	User类，包含姓名、年龄属性
View	负责UI呈现	XAML界面，包含数据绑定
ViewModel	连接View和Model，处理视图逻辑	MainViewModel包含命令和绑定属性

二、例子：

2.1.Model

  // Models/User.cspublic class User : INotifyPropertyChanged{private string _name;private int _age;public string Name{get => _name;set{_name = value;OnPropertyChanged(nameof(Name));}}public int Age{get => _age;set{_age = value;OnPropertyChanged(nameof(Age));}}public event PropertyChangedEventHandler PropertyChanged;protected virtual void OnPropertyChanged( string propertyName  ){PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));}}

2.2 ViewModel

  // ViewModels/MainViewModel.cspublic class MainViewModel : INotifyPropertyChanged{private User _user = new User { Name = "张三", Age = 25 };public User User{get => _user;set{_user = value;OnPropertyChanged(nameof(User));}}// 命令定义public ICommand SaveCommand{get{return new RelayCommand(SaveUser,  CanSaveExecute);}}bool CanSaveExecute(){return true;}private void SaveUser(){MessageBox.Show($"保存成功：{User.Name}, {User.Age}");}public event PropertyChangedEventHandler PropertyChanged;protected virtual void OnPropertyChanged(string propertyName ){PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));}}

2.3  ICommand （基本都是格式化的）

 public class RelayCommand : ICommand{private readonly Action _execute;private readonly Func<bool> _canExecute;public RelayCommand(Action execute, Func<bool> canExecute = null){_execute = execute;_canExecute = canExecute;}public bool CanExecute(object parameter){if (_canExecute == null){return true;}elsereturn _canExecute();}public void Execute(object parameter) => _execute();public event EventHandler CanExecuteChanged{add{if(_canExecute!=null){CommandManager.RequerySuggested += value;}                }remove{if (_canExecute != null){CommandManager.RequerySuggested -= value;}}           }}

2.4 调用

 public partial class Window1 : Window{//   public PersonViewModel m_PersonViewModel = new PersonViewModel();public MainViewModel model = new MainViewModel();public Window1(){InitializeComponent();DataContext = model;}
}

 <StackPanel Margin="15"><TextBox Text="{Binding User.Name,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"Margin="0,0,0,10"/><TextBox Text="{Binding User.Age, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"Margin="0,0,0,10"/><Button Content="保存" Command="{Binding SaveCommand}"Padding="10,5"/></StackPanel>