MST

星途 面试题库

面试题:C#中MVVM架构模式在WPF应用里如何实现数据绑定

请阐述在C#的WPF应用中,使用MVVM架构模式时,如何实现视图(View)与视图模型(ViewModel)之间的数据绑定,包括单向绑定和双向绑定的具体实现方式及相关代码示例。
22.8万 热度难度
编程语言C#

知识考点

AI 面试

面试题答案

一键面试

单向绑定

  1. XAML 中设置单向绑定:在视图(View)的 XAML 文件中,通过 Binding 语法设置单向绑定。假设视图模型(ViewModel)中有一个名为 MyProperty 的属性。
<TextBox Text="{Binding MyProperty}" />
  1. 视图模型(ViewModel)定义属性:在视图模型类中,定义要绑定的属性,并实现 INotifyPropertyChanged 接口以通知视图属性值的变化。
using System.ComponentModel;
using System.Runtime.CompilerServices;

public class MyViewModel : INotifyPropertyChanged
{
    private string _myProperty;
    public string MyProperty
    {
        get { return _myProperty; }
        set
        {
            if (_myProperty != value)
            {
                _myProperty = value;
                OnPropertyChanged();
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}
  1. 在视图(View)的代码后台设置数据上下文
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new MyViewModel();
    }
}

双向绑定

  1. XAML 中设置双向绑定:通过在 Binding 中设置 ModeTwoWay 来实现双向绑定。
<TextBox Text="{Binding MyProperty, Mode=TwoWay}" />
  1. 视图模型(ViewModel)处理双向绑定数据更新:与单向绑定类似,视图模型同样需要实现 INotifyPropertyChanged 接口。双向绑定时,当视图中的数据发生变化,会自动更新到视图模型的属性中。例如,当用户在 TextBox 中输入内容,视图模型的 MyProperty 属性值会随之更新。
using System.ComponentModel;
using System.Runtime.CompilerServices;

public class MyViewModel : INotifyPropertyChanged
{
    private string _myProperty;
    public string MyProperty
    {
        get { return _myProperty; }
        set
        {
            if (_myProperty != value)
            {
                _myProperty = value;
                OnPropertyChanged();
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}
  1. 视图(View)设置数据上下文:与单向绑定相同,在视图的代码后台设置数据上下文。
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new MyViewModel();
    }
}