UWP XAML Prism没有正确的数据绑定

时间:2018-11-05 07:07:50

标签: uwp prism

我正在用棱镜学习UWP,但无法正常工作。我使用Prism Mvvm模板创建了一个项目,仅添加了一个模型和一些控件。 在运行该应用程序时,顶部文本框没有绑定到MyPerson。将第二个文本框绑定到Myperson.Age则显示25。当我单击按钮时,顶部文本框显示“ Joe Blogs”,第二个文本框显示相同。什么都没有更新? 这是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; }
  }
}

我的ViewModel:

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;
       }
   }

}

1 个答案:

答案 0 :(得分:2)

Person类应实现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);
    }
}

然后,您可以简单地设置其AgeName属性:

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 };
}