MAUIMVVM数据模型理解

Posted 2022-12-16 厦门德仔

什么是MVVM模式？

MVVM就是Model-View-ViewModel的缩写，它其实就是一种设计思想。

Model 数据模型 （主要负责对数据层的CRUD）
View UI视图，负责把数据的展现在页面
ViewModel 处理业务逻辑（表单提交，按键的点击都视为业务逻辑，需要在ViewModel里面进行处理）通俗点就可以理解成,用它来处理页面的控制逻辑。因为数据库数据结构是不允许直接跟View 层数据结构对应。需要专门定义一个数据对象用于对应的View控件上(这个数据对象就是ViewModel)。而这个ViewModel 就是把Model(数据模型层) 对象封装成接受View层界面输入的数据对象
1.在MAUI 中使用MVVM数据模式
1.1 新建两个文件夹用于存放Model和ViewModel 数据结构，View层直接就是页面

1.2 当前要处理MainPage.xaml 的页面逻辑，那就需要建立相对应的层的数据处理模式

2. 模型建立好后。例如，当前我们要MainPage.xaml 页面实现一个这样的功能，当触发页面按钮时，动态刷新页面数值信息。
2.1 首先在MainModel 建立对应的数据结构。

1.MainModel 必须要继承一个接口 INotifyPropertyChanged，因为只有通过继承该接口，才能通知View页面数据发现了改变，再重新渲染页面数据。

2. 封装属性快捷按键,输入 propfull 按两次tab

2.2 然后在MainViewModel 模型中，把MainModel封装对应的ViewMainModel 数据模型对象，然后进行实例化。

2.3 最后，绑定对应的MainViewModel模型渲染到对应View层

• 第一步，MainPage.xaml 页面初始化时需要使用BindingContext 属性把MainViewModel 与页面进行绑定关联
  

• 第二步，数据模型绑定好后就可以在MainPage.xaml 页面使用 Binding 属性找到绑定MainViewModel数据对象，然后页面再用该数据对象通过.的方式就可以找到关联的MainModel 属性了
  

• 第三步，完成上面的步骤操作，数据已经正常跟页面进行绑定了
  

3. 页面数据关联绑定好后，如何通过页面点击按钮时实现值的更改
3.1 是通过Command 指令，获取用户的界面操作
在业务逻辑层MainViewModel定义对应的Command 处理指令，并进行初始化。由于Command 初始化必须传入一个(委托)方法，所以需要指定处理的方法。

在界面使用Command 属性，绑定到MainViewModel 定义好的对应的指令

3.2 最后效果

说明：这是原有MVVM的处理方式，比较繁琐些。
下一篇：可以改用MVVM 的toolkits处理，会简单很多。