WPF【11_7】WPF实战-重构与美化(ViewModel的嵌套与分解、海量数据不要Join)

11-12 【重构】ViewModel的嵌套与分解

目前我们的代码中有一个不易发现的致命问题,如果工作中这样写代码大概率会被打回去重做。那么这个问题是什么呢?

--\ViewModels\MainViewModel.cs

视图模型中的 LoadCustomers() 方法,考虑一下在这里我们访问数据库的时候使用了 Include 语句,在访问数据库的时候会同时访问数据库的预约表和客户表,并且根据外键关系对这两张表做连表查询如果。

Customers = db.Customers.Include(c => c.Appointments).ToList();

翻译为 sql 语句那么我们将会得到:

Select * from Customers as c join Appointments as a on c.Id = a. CustomerId

Appointments 表将会根据外键关系 CustomerId 来进行连接,在数据量较少的时候可能看不出问题。不过一旦数据量增加,对于海量的数据进行多表连接的效率是非常可怕的,尤其是程序在刚启动的时候加载了太多暂时不需要的数据,将会严重的影响程序的性能。

我们需要的是程序刚启动的时候只需要加载客户列表,而通过用户对客户列表的选择来选择性加载后续的预约数据。

因此在 LoadCustomers 中我们需要删除这个 Include 语句不访问 Appointments table ,而预约数据将会在后续完成客户选择以后延迟加载。

所以接下来我们需要考虑的是把主页视图模型的加载过程分解为:两个独立的过程。根据分段加载数据"创建两个独立的子视图模型"。

那么这两个视图模型就是 CustomerViewModel 以及 AppointmentViewModel ,也就是说我们的主页视图模型将会嵌套两个子视图模型。

--\ViewModels\MainViewModel.cs

public class MainViewModel

{

public List<CustomerViewModel> Customers { get; set; } = new();

public List<AppointmentViewModel> Appointments { get; set; } = new();

......

}

实际上 CustomerViewModel 它的底层模型使用的依然是客户模型 Customer ,所以我们应该创建一个私有的客户成员变量对数据进行支撑。代码进行到这里也不难发现 MVVM 的架构从理论上来说就是:视图引用视图模型而视图模型则引用最终的模型。

那么模型的数据是如何加载到 CustomerViewModel 中呢?我们可以通过构造方法来完成数据的加载。构造方法传入一个 Customer 的数据,而 Customer 通过参数把数据传递给私有成员变量 _customer 。

--\ViewModels\CustomerViewModel.cs

public class CustomerViewModel

{

private Customer _customer;

public CustomerViewModel(Customer customer)

{

_customer = customer;

}

public int Id { get => _customer.Id; }

public string Name

{

get => _customer.Name; set

{

if (_customer.Name != value)

{

_customer.Name = value;

}

}

}

............

}

接下来我们将会在 UI 中使用 CustomerViewModel 来代替上一节课对 Customer 的绑定,所以我们需要对输出的数据做一定的映射。首先我们需要向 UI 输出的就是 Customer 的 Id ,因为它是一个只读属性所以映射的时候我们只需要处理 get 就好了。

而接下来我们还需要在 UI 中显示客户的名称,而对于客户的名称我们不仅需要显示还需要更改,所以同时需要 get 和 set 。

set 就要考虑一下了,如果用户在点击用客户资料更新按钮的时候没有对姓名进行更改,那么我们难道需要把相同的数据提交给数据库吗?显然不对。所以在 set 中我们需要做一个判断:尤其仅当用户的姓名输入发生改变的时候,才修改数据。

回到主页视图模型 MainViewModel 找到 LoadCustomers 方法,方法报错了报错的原因是因为数据类型不一致,我们从数据库中获得的数据类型是列表类型的 Customer ,这是数据模型 model 。而我们对外显示的 Customers 却是视图模型 CustomerViewModel 。

所以在进行数据加载的过程中我们需要把数据从 Customer 类型转化为 CustomerViewModel 类型,这个转化过程其实也非常简单我们使用一个 for 循环就可以完成。

--\ViewModels\MainViewModel.cs

public class MainViewModel

{

public List<CustomerViewModel> Customers { get; set; } = new();

public List<AppointmentViewModel> Appointments { get; set; } = new();

......

public void LoadCustomers()

{

using (var db = new AppDbContext())

{

// Select * from Customers as c join Appointments as a on c.Id = a. CustomerId

var customers = db.Customers

//.Include(c => c.Appointments)

.ToList();

foreach(var c in customers)

{

Customers.Add(new CustomerViewModel(c));

}

}

}

}

运行时,当我们选择客户的时候,报错了!

因为此时,我们已经把视图模型从 Customer 改为 CustomerViewModel 了,所以在客户列表选择的过程中所绑定的代码同样也是 CustomerViewModel 。

--\ViewModels\MainViewModel.cs

private CustomerViewModel _selectedCustomer;

public CustomerViewModel SelectedCustomer

{

get => _selectedCustomer; set

{

if (value != _selectedCustomer)

{

_selectedCustomer = value;

}

}

}

相关推荐
大明者省12 小时前
明代大模型:智能重构下的文明再发现
重构
爱吃煎蛋的小新13 小时前
WPF入门 #1 WPF布局基础
笔记·学习·c#·wpf
qqxhb13 小时前
零基础设计模式——总结与进阶 - 3. 学习资源与下一步
学习·设计模式·重构·代码整洁之道
✎ ﹏梦醒͜ღ҉繁华落℘13 小时前
WPF学习(二)
学习·wpf
一个小番茄1 天前
# AI武装大脑:技术管理者如何用人工智能重构认知与决策系统
人工智能·重构
BearHan1 天前
非常'肤浅'的理解MVVM
wpf
ou.cs1 天前
wpf 控件开发中,OnApplyTemplate 和 OnContentRendered区别
c#·.net·wpf
界面开发小八哥2 天前
界面组件DevExpress WPF中文教程:Grid - 节点(Nodes)概述
.net·wpf·界面控件·devexpress·ui开发
ou.cs3 天前
wpf 队列(Queue)在视觉树迭代查找中的作用分析
wpf