如何通过视图更新WPF MVVM中的数据？

让我解释一下我在评论中所说的话。

现在，您拥有了一种“样式”，它不包含一个特定控件的类型，而是包含一组不同控件的一种大杂烩。这种方法不方便、缺乏支持且难以管理。首先，你需要解决这个问题。嗯，在帮助下就可以简单地解决UserControl。

简单的例子

• 右键单击项目中的项目/文件夹，然后选择“添加”>“用户控制”>指定名称>“添加”。我个人只会称呼它TestControl。

• 工作室将为我们生成2个文件，XAML并且CS（一切都像窗口一样）。

• 打开.cs并添加 2 个包含必要数据的属性。在我们的例子中，这是一个需要命令的按钮，我们还以显示标题为例。

• 实际上，我们propdp在构造函数之后编写并单击TAB，工作室会亲切地为我们创建代码，调整它以适合我们自己，设置必要的类型和名称。结果，我们得到这样的结果：

  public partial class TestControl : UserControl
  {
      public TestControl()
      {
          InitializeComponent();
      }
  
      public ICommand Command
      {
          get => (ICommand)GetValue(CommandProperty);
          set => SetValue(CommandProperty, value);
      }
      public string Title
      {
          get => (string)GetValue(TitleProperty);
          set => SetValue(TitleProperty, value);
      }
  
      public static readonly DependencyProperty CommandProperty =
          DependencyProperty.Register("Command", typeof(ICommand), typeof(TestControl), new PropertyMetadata(default));
  
      public static readonly DependencyProperty TitleProperty =
          DependencyProperty.Register("Title", typeof(string), typeof(TestControl), new PropertyMetadata(default));
  
  }
  

• 接下来，打开它XAML并在其中写入所需的设计。这里有一个关于绑定的重要点：控件没有DataContext，所有绑定通常都是通过名称或类似的机制进行的，所以一开始我们会设置控件x:Name（我通常简单地写uc）。结果，我们得到以下标记：

  <UserControl
      x:Class="WPF_net.TestControl"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:local="clr-namespace:WPF_net"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      x:Name="uc"
      d:DesignHeight="450"
      d:DesignWidth="800"
      mc:Ignorable="d">
      <StackPanel Margin="8">
          <TextBlock
              Margin="0,5"
              FontWeight="Medium"
              Text="{Binding Title, ElementName=uc}" />
          <Grid>
              <Grid.ColumnDefinitions>
                  <ColumnDefinition />
                  <ColumnDefinition Width="Auto" />
              </Grid.ColumnDefinitions>
              <TextBox x:Name="textBox" Grid.Column="0" />
              <Button
                  Grid.Column="1"
                  Command="{Binding Command, ElementName=uc}"
                  CommandParameter="{Binding Text, ElementName=textBox}"
                  Content="Отправить" />
          </Grid>
      </StackPanel>
  </UserControl>
  

  • 正如我所说，这里的关键是通过控件本身的名称进行绑定。另请注意CommandParameter，根据您的想法（据我了解），您希望TextBox使用类似的绑定将输入的文本传递给命令（同样，我们按名称查找所需的控件并获取其属性），我们将单击按钮时将输入的文本传递给命令。

• 您现在就可以使用它。打开一个窗口并在那里写入<namespace:ИмяКонтрола Свойства = "Значения" />，在我的例子中它将如下所示：<local:TestControl Title="Супер контрол с кнопкой"/>

• 工作室会一直抱怨，直到我们成功组装该项目，这就是我们实际所做的，重建它并启动它。在屏幕上我们会看到这样的东西

恭喜您获得第一个用户控件。有了它，你现在可以启动 MVVM...

MVVM、数据传输、绑定

实际上，我们现在的任务是通过单击按钮将输入的数据接收到虚拟机中，然后将其发送到模型，而模型又必须在那里执行某些操作。

• 我们编写Model，让它成为一个简单的类，它将把输入的行添加到文件中。我会尽可能简化，但我想你会理解本质......

  public class FileModel
  {
      public string Path { get; } = "TestFile.txt";
  
      public Task AddToFileAsync(string text)
          => File.AppendAllTextAsync(Path, text);
  }
  

• 现在我们编写ViewModel，它的任务很简单，使用命令从按钮获取文本并将其发送到模型。让它是这样的：

  public partial class MainViewModel : ObservableObject
  {
      private readonly FileModel _fileModel;
  
      public MainViewModel()
      {
          _fileModel = new();
      }
  
      [RelayCommand]
      private async Task Send(string text)
      {
          await _fileModel.AddToFileAsync(text);
      }
  }
  

  • 看到这里你可能会感到惊讶，这个奇怪的代码是什么，这是什么RelayCommand，这是什么partial等等ObservableObject？我很懒（我建议你这样做），我将这些ICommand等的所有实现都交给了INotifyPropertChanged“代码生成器”。如果你有兴趣，就研究一下CommunityToolkit.Mvvm，如果没有，就手动写一下；网上有很多这方面的例子。

• 剩下的就是将命令绑定到窗口XAML并将其设置到DataContext窗口。我们在 XAML 中编写一个绑定到我们的控件的命令，然后我们得到<local:TestControl Title="Супер контрол с кнопкой" Command="{Binding SendCommand}"/>.好吧，我们将窗口设置DataContext为MainViewModel（我将其写在构造函数中DataContext = new MainViewModel();，但你不应该这样做）。

• 让我们启动并尝试一下。单击时，将创建一个文件，并向其中添加一个新行，该行写入用户控件文本字段中。

这实际上是一个最简单、基本的项目示例，根据 MVVM 规则，具有绑定，甚至具有自己的控制。