使用 MVVM 在 MainWindow 上绑定 UserControl View 模型 [英] Binding UserControl View model on MainWindow with MVVM

问题描述

我是 WPF 和 MVVM 的新手，我正在尝试学习 WPF 如何与 MVVM 一起工作.为此，我做了一个样本如下

I am newbie to WPF and MVVM and I am trying to learn how WPF working with MVVM. For that, I have made a sample as follows

<StackPanel>
        <TextBox   Text="{Binding MyString}" />
</StackPanel>

UserControl1ViewModel.cs

class UserControl1ViewModel
{
     public string MyString { get; set; }
}

MainWindow.xaml

<StackPanel>
        <local:UserControl1 DataContext="{Binding UC1Property}"/>  //tried binding the Usercontrol1VM obj on MainWindowVM
        <Button Command="{Binding ShowMeOne}" Height="30" Content="ShowOne"/>
        <Button Command="{Binding ShowMeAnother}" Height="30" Content="ShowAnother" />
</StackPanel>

MainWindow.xaml.cs

public MainWindow()
{
   InitializeComponent();
   this.DataContext = new MainWindowViewModel();
}

MainWindowViewModel.cs

class MainWindowViewModel
{
    public MainWindowViewModel()
    {
        ShowMeOne = new RelayCommand(Prompt_ShowMeOne);
        ShowMeAnother = new RelayCommand(Prompt_ShowMeAnother);
        UC1Property.MyString = "Initial";
    }

    private void Prompt_ShowMeAnother(object obj)
    {
        global::System.Windows.MessageBox.Show("Another Should be shown");     
        UC1Property.MyString = "Last Clicked:  Another";
    }

    private void Prompt_ShowMeOne(object obj)
    {
        global::System.Windows.MessageBox.Show("One Should be shown");
        UC1Property.MyString = "Last Clicked:  One";
    }

    public ICommand ShowMeOne { get; set; }
    public ICommand ShowMeAnother { get; set; }


    //UserControl1 View Model for MainWindow
    public UserControl1ViewModel UC1Property { get; set; }


}

问题: 现在，我如何将 Usercontrol 的 Datacontext 传递到 MainWindow 中?

Problem: Now, how can I pass the Datacontext of the Usercontrol into the MainWindow?

-----------------------------In MainWindow.xaml----------------------
<local:UserControl1 DataContext="{Binding UC1Property}"/>  //tried binding the Usercontrol1VM obj on MainWindowVM
-----------------------------In MainWindowViewModel.cs---------------
//UserControl1 View Model for MainWindow
public UserControl1ViewModel UC1Property { get; set; }

我尝试的上述代码没有按预期工作.在窗口上传递用户控件的数据上下文的标准方法是什么?

Above code which I tried is not working as expected. What is the standard way of passing the datacontext of usercontrol over the window?

推荐答案

您在这里对 MVVM、视图和用户控件有一个普遍的误解.

You got a general misunderstanding here about MVVM, Views and UserControls.

A UserControl 是一段可重复使用的代码，它不特定于一种应用程序.也就是说，当您创建新的 UserControl 时，没有 UserControl1ViewModel.

A UserControl is a reusable piece of code, that is not specific to one kind of application. That being said, there is no UserControl1ViewModel, when you create a new UserControl.

UserControl 是自我维持的，您的用户控件需要的所有逻辑都在代码后面.明确地说，这不违反了 MVVM 模式.MVVM 模式适用于视图和视图模型以及它们如何交互.

A UserControl is self-sustained and all the logic your user control needs goes in there in code behind. To make it clear, this is not a violation of MVVM pattern. MVVM pattern applies to Views and ViewModels and how they interact.

View(纯 XAML，无逻辑)之间存在细微差别.视图也经常从 UserControl 继承，但是 View 只适用于您现在正在开发的应用程序.您不太可能在另一个应用程序中重用它.

There is a subtle difference between a View (pure XAML, no logic). Views also often inherit from UserControl, but a View is only good in the application you are developing right now. You are very unlikely to be able to reuse this in another application.

这是UserControl 之间的区别.例如，日历用户控件是可重用的，选择和显示日历的所有逻辑都是其控件代码的一部分，您可以在许多类型的应用程序中使用它.

That's a difference, between the UserControl. For example, a calendar user control is reusable and all the logic to choose and display the calendar is part of it's control code behind and you can use it in many kind of applications.

当你创建一个使用数据绑定的 UserControl 时，你需要在你的用户控件中公开依赖属性，在日期选择器用户控件上这可能是 MinDate、MaxDate、SelectedDate、FirstDayOfTheWeek(星期日或星期一)和/或控制格式并隐藏 中的所有其他属性的属性UserControl 的 XAML(通过不通过依赖属性公开它们).

When you create a UserControl which uses data-bindings, you need to expose dependency properties in your user control, on an date-picker user control this may be MinDate, MaxDate, SelectedDate, FirstDayOfTheWeek (Sunday or Monday) and/or properties that control the formatting and hide all other properties inside your UserControls XAML (by not exposing them via Dependency Properties).

这篇关于使用 MVVM 在 MainWindow 上绑定 UserControl View 模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！