从视图模型将数据绑定到视图中的 XAML 控件的正确设计

本文关键字：视图 控件 XAML 模型 数据绑定 | 更新日期: 2023-09-27 18:34:40

对于上下文，我正在构建一个通用的Windows应用商店应用程序。

我刚刚开始学习 C# 和 MVVM 模式，我需要帮助正确实现绑定。

我遵循了本教程(绑定(并了解了它的工作原理，但是在此示例中，执行绑定的代码存储在 View 类中。

public partial class MainPage : Page
{
public ObservableCollection<TermTest> MyTerms = new ObservableCollection<TermTest>();
public MainPage()
{ 
    this.InitializeComponent();
    MyTerms.Add(new TermTest("BNC", "Wire"));
    MyTerms.Add(new TermTest("Lens", "Collects light"));
    this.DataContext = new CollectionViewSource { Source = MyTerms }; 
}

据我了解，这是糟糕的设计。在我的实现中，我将使用我的模型来检索数据，这些数据将被放入可观察集合中。然后，在我的 ViewModel 中，我希望将 ObservableCollection 绑定到使用它的 XAML 控件，而不是将集合发送到视图，然后在视图中调用方法来填充 XAML 控件。

这是执行此操作的正确方法吗？如果是，应该如何执行此操作，因为我不知道如何将 XAML 控件公开给我的 ViewModel(并且认为我不应该这样做，对吧？

我知道我可以公开创建 Mainpage 新实例的控件，但这毫无用处，因为我需要绑定到当前实例。 

Mainpage Test = new MainPage();

有人可以帮我解释一下吗 - 我已经阅读了很多，要么没有找到答案，要么不理解它！

谢谢，詹姆斯

从视图模型将数据绑定到视图中的 XAML 控件的正确设计

首先，你肯定有正确的想法。

您要做的是创建一个ViewModel对象(让它实现INotifyPropertyChanged(，如下所示：

public class MainViewModel : INotifyPropertyChanged
{
    //INPC implementation
    public ObservableCollection<TermTest> MyTerms
    {
       //Standard INPC property stuff
    }
}

请注意，我使用了一个属性。只能绑定到属性，并且需要 set 方法来引发PropertyChanged事件。

然后，设置视图的数据上下文。您可以通过多种方式执行此操作，但最简单的方法是执行此操作：

public MainView() //Default Constructor
{
    InitializeComponent();
    DataContext = new MainViewModel();
}

最后，绑定！

<ListView ItemsSource="{Binding MyTerms}"/>

另外，如果您不想触摸窗口后面的代码，则可以执行以下操作：

  <Window.Resources>
    <YourNamespace:MainViewModel x:Key="MainViewModel"/>
   </Window.Resources>
   <Grid DataContext="{StaticResource MainViewModel}">
        <ListView x:Name="TermsListView" ItemsSource="{Binding MyTerms}">    
        </ListView>
   </Grid>

如果您想详细了解此模式，我建议您阅读本文：WPF MVVM 逐步(从基础知识到高级级别(

相关文章：