当我们使用 MVVM 模式时,我们究竟在每一层里做些什么?
这篇文章不会说 MVVM 是什么,因为讲这个的文章太多了;也不会说 MVVM 的好处,因为这样的文章也是一搜一大把。我只是想说说我们究竟应该如何理解 M-V-VM,当我们真正开始写代码时,应该在里面的每一层里写些什么。
MVVM,当然三层——M-V-VM。就凭这个“三层”结构,WPF/UWP 开发者们就能折腾出一个完整的程序出来。M——定义数据模型啊,V——视图啊,VM——视图模型。其中 M 和 V 的中文词语和英文单词是很好理解的,但是 VM 就不是个日常用词;于是各种不知道应该放在哪里的代码便一窝蜂全放进了 VM 中,最终导致了 VM 的无限膨胀,成百上千行也是司空见惯啊!
可是,若 VM 不膨胀,那让 M 或者 V 膨胀吗?当然不是,谁都不要膨胀!于是那么多的代码写到哪里呢?
答案:MVVM 之外。
我们的代码不止 MVVM 三层
MVVM 不是应用程序架构,只是一个 GUI 类程序的开发模式而已。这意味着它只是用来解决我们应用程序中 GUI 部分的开发问题,并不能用来解决其他问题。而一个能持续发展的程序怎么能只有 GUI 呢?
- MVVM 只是数据驱动型 GUI 程序建议的开发模式;无论是三层中的哪一层,本质上都是在解决 UI 问题。
而非 UI 问题根本就不在 MVVM 的讨论之列。
不知看到这里时你会不会喷我一脸——“V”解决 UI 问题也就算了,“VM”和“M”算什么 UI!
VM,视图模型。其本质是模型。什么的模型?“视图”的模型。这是为真实的 UI 做的一层抽象模型。也就是说,VM 其实是“抽象的 UI”。
接着喷——“V”和“VM”解决 UI 问题也就算了,“M”算什么 UI!
M,数据模型。作为数据驱动型 GUI 程序,这些数据是用于驱动 UI 的数据;比如网络请求的数据,本地文件储存的数据。定义这些数据模型是为了与其他组件、其他程序、其他设备传递数据,并将这些数据为视图模型所用。那些不驱动 UI 的数据根本不在此谈论之列。如果你觉得这样的解释有些牵强,那我也无话可说;但是当我们将它理解成“驱动 UI 的数据”时,我们将能够更容易地组织我们的代码,使之不容易发生混乱。
MVVM 模式按此理解后,我们将更能够将代码放到合适的位置,避免 VM 代码的膨胀:
- 公共的控件或者辅助代码应该抽出来放到别处,比如形成公共组件
- 一些非 UI 的业务功能单独做,独立于 MVVM 模式,对 VM 提供调用接口即可。
MVVM,应该做什么,不应该做什么
这一节内容部分参考自:MVVM standardization - W3Cgeek。
View
- 想进行测试的逻辑都不要放到这里
- 不止能是
Window/Page/UserControl,还能是Control/DataTemplate- 可以考虑使用
DataTrigger、ValueConverter、VisualState或者Blend中提供的Behivor机制来处理 ViewModel 对应的 UI 展现方式
ViewModel
- 这里需要保持抽象 UI 的状态,这样才可以在据此 ViewModel 创建多个 View 的时候,这些 View 能够完全一致而不用把此前逻辑再跑一边
- 无论如何都不能引用 View,就算是接口也不行
- 注意不要去调用一些单例类或者带状态的静态类,这样才好进行单元测试
Model
- 那些通过各种途径搜罗来的数据
- 不能引用 View,也不能引用 ViewModel
View 通知 ViewModel
- 推荐用数据绑定
- 尽量不要直接调用 ViewModel,但必要的时候也可以去调用
ViewModel 通知 View
- 属性绑定
- 事件通知
- 消息(比如 EventAggregator/Message/RX 框架)
- 通过中间服务调用
- 直接由 View 传入一个委托,ViewModel 去调用那个委托
参考资料
- Recommendations and best practices for implementing MVVM and XAML/.NET applications « Rico Suter
- MVVM standardization - W3Cgeek
当我们使用 MVVM 模式时,我们究竟在每一层里做些什么?的更多相关文章
- Prism 4 文档 ---第5章 实现MVVM模式
MVVM模式有助于清楚的区分应用程序界面的业务层和展现层.保持一个清晰的应用程序逻辑和UI分离有助于处理开发和设计过程中大量的问题,同时,使得应用程序的测试,维护,和扩展更加容易.MVVM也可 ...
- WPF MVVM从入门到精通1:MVVM模式简介
原文:WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 W ...
- MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息
MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二 ...
- MVVM模式解析和在WPF中的实现(五)View和ViewModel的通信
MVVM模式解析和在WPF中的实现(五) View和ViewModel的通信 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 M ...
- MVVM模式解析和在WPF中的实现(三)命令绑定
MVVM模式解析和在WPF中的实现(三) 命令绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- MVVM模式和在WPF中的实现(二)数据绑定
MVVM模式解析和在WPF中的实现(二) 数据绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- MVVM模式和在WPF中的实现(一)MVVM模式简介
MVVM模式解析和在WPF中的实现(一) MVVM模式简介 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在 ...
- dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
- 由项目浅谈JS中MVVM模式
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1. 背景 最近项目原因使用了durandal.js和knock ...
随机推荐
- 关于Visual Studio 2010自动添加头部注释信息
作为一个万年潜水党,不关这一篇文章技术含量如何,也算是一个好的开始吧. 在日常的开发中我们经常需要为类库添加注释和版权等信息,这样我们就需要每次去拷贝粘贴同样的文字,为了减少这种重复性的工作,我们 ...
- lessc的安装
win+R,cmd打开命令面板,输入cnpm install -g less,如图,然后就可以通过lessc -v查询lessc的版本,出现版本号证明安装成功
- UVA-10917 Walk Through the Forest (dijkstra+DP)
题目大意:n个点,m条边的无向图.一个人从起点到终点按照下面的走法:从A走向B当A到终点的最小距离比B到终点的最小距离大时.问从起点到终点有多少路径方案. 题目分析:先用dijkstra预处理出终点到 ...
- python:使用itchat实现手机控制电脑
1.准备材料 首先电脑上需要安装了python,安装了opencv更好(非必需) 如果安装了opencv的话,在opencv的python目录下找到cv2.pyd,将该文件放到python的库搜索路径 ...
- 006——数组(六)array_fill()array_filter()array_flip()array_key_exists()array_keys()
<?php /*数组(六)array_fill()array_filter()array_flip()array_key_exists()array_keys() */ /*1.array_fi ...
- js停止(阻止)浏览器继续加载内容
这个应该是一个比较特殊的要求,一般网站都没有这个功能,对于一个新手来说,真的不知道从何处下手,只有在网上搜索了,寻找现成答案,寻寻觅觅一天没有结果.但是这个功能还是需要,第二天继续网上大肆搜寻.终于功 ...
- 马士兵_JAVA自学之路(为那些目标模糊的码农们)
转载自:http://blog.csdn.net/anlidengshiwei/article/details/42264301 JAVA自学之路 一:学会选择 为了就业,不少同学参加各种各样的培训. ...
- PostgreSQL文档编译
之前一直没有将doc进行编译,最近编译成功了,却无法用man来查看,发现是没有将man的目录添加到搜索路径: MANPATH /usr/pgsql-10/share/man 加入到 /etc/man. ...
- 全新Wijmo5中文学习指南正式上线
Wijmo 是一款使用 TypeScript 编写的新一代 JavaScript/HTML5 控件集.它秉承触控优先的设计理念,在全球率先支持 AngularJS,并且支持React.VueJS以及T ...
- gdi+ 中发生一般性错误 wpf解决方法
错误背景:原来在winform程序中写了一个窗口,在wpf应用程序中调用显示了这个窗口,有个头像功能,加载本地的一个图片文件,加载前进行了各种逻辑判断,效果如下: 而加载的关键代码如下面: pictu ...