如何在MVVM中显示WPF数据网格中的数据

本文关键字:数据 数据网 网格 WPF 显示 MVVM | 更新日期: 2023-09-27 18:01:49

我的xaml代码

<Window x:Class="SampleWPFApp.View.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:viewmodel="clr-namespace:SampleWPFApp.ViewModel"
        Title="Window1" Height="500" Width="500">
    <Window.Resources>
        <viewmodel:FirstPageViewModel x:Key="fp"></viewmodel:FirstPageViewModel>
    </Window.Resources>
<Grid>
    <TextBox HorizontalAlignment="Left" Height="23" Margin="75,38,0,0" TextWrapping="Wrap" Text="{Binding FirstName, Source={StaticResource fp}}" VerticalAlignment="Top" Width="120"/>
    <TextBox HorizontalAlignment="Left" Height="23" Margin="75,79,0,0" TextWrapping="Wrap" Text="{Binding LastName, Source={StaticResource fp}}" VerticalAlignment="Top" Width="120"/>
    <Button Content="Add" HorizontalAlignment="Left" Margin="104,118,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.093,1.636" Command="{Binding acomm, Source={StaticResource fp}}" />
    <DataGrid HorizontalAlignment="Left" Name="mydatagrid" Margin="47,194,0,0" VerticalAlignment="Top" Height="178" Width="385" ItemsSource="{Binding Path=MyDataGrid,Mode=TwoWay,NotifyOnSourceUpdated=True,NotifyOnTargetUpdated=True}" DataContext="{DynamicResource fp} " Loaded="DataGrid_Loaded"/>
</Grid>

我的属性,网格绑定到ViewModel,

private List<Employee> mysampleGrid;
public List<Employee> MySampleGrid
{
    get
    {
        return mysampleGrid;
    }
    set
    {
        mysampleGrid = value;
        OnPropertyChanged("MySampleGrid");
    }
}

在ViewModel中单击按钮时调用的方法,

public void AddDataToDb()
{            
    e.FirstName = FirstName;
    e.LastName = LastName;
    context.Employees.Add(e);
    context.SaveChanges();
    this.MySampleGrid = null;
    //Setting List to value from database after inserting into db
    MySampleGrid = context.Employees.Where(x => x.FirstName != null).ToList();
}

但是,即使在设置列表(绑定到datagrid)的值之后,数据库网格在UI中也没有更新/刷新。请帮助。我也实现了INotifyPropertyChanged接口

如何在MVVM中显示WPF数据网格中的数据

你可以做几件事来改进你的代码

  1. 首先我建议你使用ObservableCollection,因为它有更改跟踪机制。
  2. 还将网格的DataContext设置为视图模型,而不是单个控件的数据上下文到视图模型

把所有东西放在一起,你的代码现在看起来像这样:

     private ObservableCollection<Employee> mysampleGrid=new ObservableCollection<Employee>();
            public ObservableCollection<Employee> MysampleGrid
            {
                get { return mysampleGrid; }
                set { mysampleGrid= value; }            
            }
public void AddDataToDb()
    {            
        e.FirstName = FirstName;
        e.LastName = LastName;
        context.Employees.Add(e);
        context.SaveChanges();
        this.MySampleGrid = null;
        //Setting List to value from database after inserting into db
        var employees = context.Employees.Where(x => x.FirstName != null).ToList();
        foreach(var employee in employees)
        mysampleGrid.Add(employee);
    }

最后在你的视图

<Window x:Class="SampleWPFApp.View.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:viewmodel="clr-namespace:SampleWPFApp.ViewModel"
        Title="Window1" Height="500" Width="500">
    <Window.Resources>
        <viewmodel:FirstPageViewModel x:Key="fp"></viewmodel:FirstPageViewModel>
    </Window.Resources>
<Grid DataContext="{StaticResource fp}">
            <TextBox HorizontalAlignment="Left" Height="23" Margin="75,38,0,0" TextWrapping="Wrap" Text="{Binding FirstName}" VerticalAlignment="Top" Width="120"/>
            <TextBox HorizontalAlignment="Left" Height="23" Margin="75,79,0,0" TextWrapping="Wrap" Text="{Binding LastName}" VerticalAlignment="Top" Width="120"/>
            <Button Content="Add" HorizontalAlignment="Left" Margin="104,118,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.093,1.636" Command="{Binding acomm}" />
            <DataGrid HorizontalAlignment="Left" Name="mydatagrid" Margin="47,194,0,0" VerticalAlignment="Top" Height="178" Width="385" ItemsSource="{Binding Path=MysampleGrid,Mode=TwoWay,NotifyOnSourceUpdated=True,NotifyOnTargetUpdated=True}"  Loaded="DataGrid_Loaded"/>
        </Grid>

如果你看看你的ItemsSource绑定:

ItemsSource="{Binding Path=MyDataGrid,Mode=TwoWay,NotifyOnSourceUpdated=True,NotifyOnTargetUpdated=True}"

你会注意到你要绑定的属性不存在。这应该是MySampleGrid

作为题外话,绑定的大部分内容可以省略,这应该是所有需要的:
ItemsSource="{Binding MySampleGrid}"

设置WindowDataContext也是有意义的,子元素将从中继承,剩余的DataContext属性可以被删除。