c# - 将代码移至 viewModel 类绑定(bind)

Question

了解后ObservableCollection和 INotifyPropertyChanged ，我正在尝试使用它们将我的代码划分为 MVVM .

但是我在代码隐藏类之外绑定(bind)时遇到了一些麻烦。

我的应用程序有三个框，可让您输入一个人的姓名、收入、年龄。然后它将在 DataGrid 上显示它们。

xml:

<Window x:Class="myApp.MainWindow"
 [...]

  <Grid>
     <DataGrid  x:Name="peopleDisplay">
     </DataGrid>
  </Grid>    

</Window>

在 MainWindow.xaml.cs 中(无结构)

 public partial class MainWindow : Window
 {
    private ObservableCollection<Person> peopleList = new ObservableCollection<Person>();

    public MainWindow()
    {
        InitializeComponent();

        peopleDisplay.ItemsSource = peopleList;

    }

    private void btnAddProduct_Click(object sender, RoutedEventArgs e)
    {

      peopleList.Add(new Person { personName = nameBox.text, income = incomebox.text, age = ageBox.text });

      }

    [...]
   }


class People : INotifyPropertyChanged
 {
    private string personName;

    public event PropertyChangedEventHandler PropertyChanged;

    public void NotifyPropertyChanged(string propName)
    {
        if (this.PropertyChanged != null)
            this.PropertyChanged(this, new PropertyChangedEventArgs(propName));
    }

    public string PersonName {
        get
        {
            return this.personName;
        }
        set
        {
            if( this.personName != value)
            {
                this.PersonName = value;
                this.NotifyPropertyChanged("PersonName");
            }

        }
    }
    public int age { get; set; }
    public double income { get; set; }
}

我的主要问题:

所以现在我想做两件事:添加一个新函数来计算每个人的总收入，将上面的 ObservableCollection 移动到 viewModel 类

现在在新的 viewModel 类中我有 ObservableCollection personList (而不是代码里面)，但是把计算方法和属性也放在这里有错吗？如果我将计算属性放在这里，这个 viewModel 将继承 INotifyPropertyChanged，所以当 totalIncome 属性更改时，它会自动更改 UI。但是，将它放在 person 模型中是没有意义的，因为该类代表一个人。

如何将 viewModel 中的此人员列表绑定(bind)到 xaml？如果列表在代码隐藏中，我可以做 peopleDisplay.ItemsSource = peopleList; ，但是这个 viewModel 是一个类而不是 ObservableCollection 对象，我不能将它设置为 dataGrid 的 ItemsSource。有没有办法在 viewModel 类中绑定(bind)它？我正在学习 mvvm，所以我也可能在这里做错了。请咨询

Answer 1

您的 Model类是人。如下所示:

public class People : INotifyPropertyChanged
{
    private string personName;

    public event PropertyChangedEventHandler PropertyChanged;


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

    public string PersonName
    {
        get
        {
            return this.personName;
        }
        set
        {
            if( this.personName != value)
            {
                this.PersonName = value;
                this.NotifyPropertyChanged();
            }
        }
    }

    public int Age { get; set; }
    public double Income { get; set; }
}

您的 ViewModel如下所示:

public class PeopleViewModel 
{
    Public List<People> ListOfPeople { get; set; }
}

ViewModel可以执行 INotifyPropertyChanged通知 View 的界面。

现在您可以将数据上下文设置为 PeopleViewModel并绑定(bind)你的 ListOfPeople给您的 DataGrid .

设置 DataContext为您的 View您可以从 XAML 或后面的代码中执行此操作。

设置 ItemsSource为您的 DataGrid在您的 View .

XAML:

<Window x:Class="myApp.MainWindow" DataContext="{Binding PeopleViewModel }">
    <Grid>
        <DataGrid  x:Name="peopleDisplay" ItemSource={Binding ListOfPeople}>
            ......
        </DataGrid>
    </Grid> 
</Window>

Reference 1

Reference 2