如何手写一个mvvm的实现呢？采用mvvm的方案实现用户登录

如何手写一个mvvm模式实现用户登录？-wpf免费课件代码

如果你觉得本课件对你有用，请多多转发，关注。让更多的人看到。 

一、创建一个Model

首先在项目下建立一个文件夹Model,在里面再创建一个类:User.cs 

namespace MyAgvLesson.Model
{
   public class User
    {
        public string? UserName { get; set; }
        public string? Password { get; set;}
    }
}

 二、创建ViewModel

 如上图一样，先创建一个ViewModel的文件夹，之后在下面创建一个UserViewModel.cs的类文件。具体的代码如下：

using MyAgvLesson.Model;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;
using System.Windows.Input;


namespace MyAgvLesson.ViewModel
{

    public class RelayCommand : ICommand
    {
        public event EventHandler? CanExecuteChanged
        {
            add { 
            CommandManager.RequerySuggested += value;
            
            } remove { 
            CommandManager.RequerySuggested -= value;   
            }
        }
        /// <summary>
        /// 执行命令
        /// </summary>
        private readonly Action<object?>? _execute;
        /// <summary>
        /// 确认命令是否执行，如果返回true，执行，否则不执行
        /// </summary>
        private readonly Func<object?, bool>? _canExecute;

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

        public bool CanExecute(object? parameter)
        {
            return _canExecute == null || _canExecute(parameter);
        }


        public void Execute(object? parameter)
        {
            if (_execute != null)
                _execute(parameter);
        }

       
    }
    public class UserViewModel : INotifyPropertyChanged
    {

        public UserViewModel() { 
        _user=new User();
        }
        public event PropertyChangedEventHandler? PropertyChanged;

        private ICommand _loginCommand;

        public ICommand LoginCommand
        {
            get
            {
                return _loginCommand??new RelayCommand(param=>LoginSave()); 
            }
        }


        private void LoginSave()
        {
            MessageBox.Show($"用户名是:{_user?.UserName},密码是:{_user?.Password}");
        }

        private User? _user;

        public string? UserName
        {
            get { return _user?.UserName; }
            set
            {
                if (_user != null)
                {
                    if (_user.UserName != value)
                    {
                        _user.UserName = value;
                        OnPropertyChanged();
                    }
                }
            }
        }

        public string? Password
        {
            get { return _user?.Password; }
            set
            {
                if (_user != null)
                {
                    if (_user.Password != value)
                    {
                        _user.Password = value;
                        OnPropertyChanged();
                    }
                }
            }
        }

        protected void OnPropertyChanged([CallerMemberName] string? propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }


    }
}

 三、修改视图（如果没有看前面的课件，就创建）

1. 从项目里找到视图下的login.xaml,修改代码如下：

 <DockPanel Grid.Column="1" VerticalAlignment="Center" Margin="20,0,20,0">
     <TextBlock  Text="欢迎使用AGV调度系统" Margin="0 20"  DockPanel.Dock="Top" FontSize="20" FontStyle="Oblique" FontWeight="Bold"/>
     <TextBox  Text="{Binding UserName,UpdateSourceTrigger=PropertyChanged}" Height="30" Padding="5" DockPanel.Dock="Top" />
     <PasswordBox  Height="30" Padding="5" DockPanel.Dock="Top" Margin="0 10 0 0" />
     <Button Content="登录" Command="{Binding LoginCommand}" Style="{DynamicResource btn}" Width="100"/>
 </DockPanel>

主要关注：

Text="{Binding UserName,UpdateSourceTrigger=PropertyChanged}"

 Command="{Binding LoginCommand}"

四、在登录后台代码中设置DataContext

在login.xaml的隐藏文件中，我们将DataContext设置为userViewModel

代码如下：

  public Login()
  {
      InitializeComponent();
      DataContext = new UserViewModel();
  }