UWP XAML Prism 数据绑定不正确

Question

我正在学习使用 Prism 的 UWP，但我无法让它工作。我使用 Prism Mvvm 模板创建了一个项目，我只添加了一个模型和一些控件。在运行应用程序上，绑定到 MyPerson.Name 的顶部文本框没有任何内容，绑定到 Myperson.Age 的第二个文本框显示 25。当我单击按钮时，顶部文本框显示 "Joe Blogs"和第二个文本框 remians 相同。什么都没有更新？这是 XAML 代码：

<Page
x:Class="App5.Views.MainPage"
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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:prismMvvm="using:Prism.Windows.Mvvm"
prismMvvm:ViewModelLocator.AutoWireViewModel="True"
Style="{StaticResource PageStyle}"
mc:Ignorable="d">
<Grid x:Name="ContentArea" Margin="{StaticResource MediumLeftRightMargin}">
    <Grid.RowDefinitions>
        <RowDefinition Height="48" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <TextBlock
        x:Uid="Main_Title"
        Grid.Row="0"
        Style="{StaticResource PageTitleStyle}" />
    <Grid Grid.Row="1" Background="{ThemeResource SystemControlPageBackgroundChromeLowBrush}">
        <StackPanel>
            <TextBox
                Width="100"
                Height="100"
                Text="{x:Bind Path=ViewModel.MyPerson.Name, Mode=TwoWay}" />
            <TextBox
                Width="100"
                Height="100"
                Text="{x:Bind Path=ViewModel.MyPerson.Age, Mode=TwoWay}" />
            <Button
                Width="100"
                Height="100"
                HorizontalAlignment="Center"
                Click="Button_Click"
                Content="test" />
        </StackPanel>

    </Grid>
</Grid>

我的模特：

namespace App5.Models
{
  public class Person
  {
      public int Age { get; set; }
      public string Name { get; set; }
  }
}

我的视图模型：

using App5.Models;
using Prism.Windows.Mvvm;

namespace App5.ViewModels
{
    public class MainViewModel : ViewModelBase
    {
        private Person _myPerson;
        public Person MyPerson
        {
            get => _myPerson;
            set => SetProperty(ref _myPerson, value);
        }
        public MainViewModel()
        {
             MyPerson = new Person() { Age = 25, Name = "Bill Blogs" };

        }

    } 

}

我背后的代码：

using System;

using App5.ViewModels;

using Windows.UI.Xaml.Controls;

namespace App5.Views
{
    public sealed partial class MainPage : Page
    {
        private MainViewModel ViewModel => DataContext as MainViewModel;

        public MainPage()
        {
            InitializeComponent();

        }
        private void MainPage_Loaded(object sender, 
      Windows.UI.Xaml.RoutedEventArgs e)
    {
    }
    private void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
           ViewModel.MyPerson.Name = "Viv Blogs";
           ViewModel.MyPerson.Age = 50;
           ViewModel.MyPerson = ViewModel.MyPerson;
       }
   }

}

Answer 1

Person class 应该实现 INotifyPropertyChanged 接口并发出更改通知：

public class Person : ViewModelBase
{
    private int _age;
    public int  Age
    {
        get => _age;
        set => SetProperty(ref _age, value);
    }

    private int _name;
    public int Name
    {
        get => _name;
        set => SetProperty(ref _name, value);
    }
}

然后您可以简单地设置它的 Age 和 Name 属性：

private void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
    ViewModel.MyPerson.Name = "Viv Blogs";
    ViewModel.MyPerson.Age = 50;
}

要让 MainViewModel 在您设置 MyPerson 属性时发出更改通知，您需要将属性设置为新的 Person对象：

private void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
    ViewModel.MyPerson = new MyPerson() { Name = "Viv Blogs", Age = 50 };
}

UWP XAML Prism 数据绑定不正确

UWP XAML Prism Not DataBinding Correctly

prism

uwp