在2008年Chrome V8引擎横空出世,让Javascript的效率有了质的飞跃,天才的Ryan Dahl将V8放到服务器上运行Javascript,Node.js便瓜瓜坠地,Node.js不仅给带来了高性能的服务器,还推动了前端的工程化。前端的逻辑越来越重,改变迫在眉睫,MVVM模式便走进了前端的架构设计中。

MVVM是Model-View-ViewModel的缩写。mvvm是一种设计思想。Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑;View 代表UI 组件,它负责将数据模型转化成UI 展现出来,ViewModel 是一个同步View 和 Model的对象。

在MVVM架构下,View和Model之间没有直接的联系,它们通过ViewModel进行交互,Model和ViewModel之间是交互是双向的,因此,View和Model的数据变化是同步的。

综上,我们操作数据就是操作视图,而无需操作DOM,开发者只需专注于ViewModel中业务逻辑的编写,View层将自动响应,能够极大的提高效率。其实,MVVM就是一种分层架构,Model:数据层模型;View:视图模版;ViewModel:负责具体业务逻辑,监听View和Model的数据变化的同步工作。

什么是MVVM?的更多相关文章

  1. Vue.js 和 MVVM 小细节

    MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...

  2. 领域驱动和MVVM应用于UWP开发的一些思考

    领域驱动和MVVM应用于UWP开发的一些思考 0x00 起因 有段时间没写博客了,其实最近本来是根据梳理的MSDN上的资料(UWP开发目录整理)有条不紊的进行UWP学习的.学习中有了心得体会或遇到了问 ...

  3. MVVM框架从WPF移植到UWP遇到的问题和解决方法

    MVVM框架从WPF移植到UWP遇到的问题和解决方法 0x00 起因 这几天开始学习UWP了,之前有WPF经验,所以总体感觉还可以,看了一些基础概念和主题,写了几个测试程序,突然想起来了前一段时间在W ...

  4. MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息

    MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二 ...

  5. MVVM模式解析和在WPF中的实现(五)View和ViewModel的通信

    MVVM模式解析和在WPF中的实现(五) View和ViewModel的通信 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 M ...

  6. MVVM设计模式和WPF中的实现(四)事件绑定

    MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  7. MVVM模式解析和在WPF中的实现(三)命令绑定

    MVVM模式解析和在WPF中的实现(三) 命令绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  8. MVVM模式和在WPF中的实现(二)数据绑定

    MVVM模式解析和在WPF中的实现(二) 数据绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  9. MVVM模式和在WPF中的实现(一)MVVM模式简介

    MVVM模式解析和在WPF中的实现(一) MVVM模式简介 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在 ...

  10. 从Script到Code Blocks、Code Behind到MVC、MVP、MVVM

    刚过去的周五(3-14)例行地主持了技术会议,主题正好是<UI层的设计模式——从Script.Code Behind到MVC.MVP.MVVM>,是前一天晚上才定的,中午花了半小时准备了下 ...

随机推荐

  1. 解决Linux主机上的 远程MySQL客户端无法连接的问题

    无法连接到 MySQL 数据库可能的原因有: 1. PHP 无法连接 MySQL 可能是 PHP 配置不正确,没加上连接 MySQL 的功能. 2. MySQL 软件包升级,但没有升级数据库,或安装 ...

  2. bzoj 3709: [PA2014]Bohater【贪心】

    先打能回血的,按消耗从小到大打: 然后按回血量降序打剩下的(把消耗和回血反着看就是上一种怪,打法一样): 中间体力小于0就输出无解 #include<iostream> #include& ...

  3. selenium3 + python - js 内嵌滚动处理

    一.js内嵌html <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  4. NOIp2013 车站分级 【拓扑排序】By cellur925

    题目传送门 我们注意到,题目中说:如果这趟车次停靠了火车站 x,则始发站.终点站之间所有级别大于等于火车站x的都必须停靠.有阶级关系,满满的拓扑排序氛围.但是,如果我们按大于等于的关系连,等于的情况就 ...

  5. 用for循环实现的菱形图案

    package com.wh.lingxing; import java.util.Scanner; public class LingXing { public static void main(S ...

  6. 448 Find All Numbers Disappeared in an Array 找到所有数组中消失的数字

    给定一个范围在  1 ≤ a[i] ≤ n ( n = 数组大小 ) 的 整型数组,数组中的元素一些出现了两次,另一些只出现一次.找到所有在 [1, n] 范围之间没有出现在数组中的数字.您能在不使用 ...

  7. DOM简介及节点、属性、查找节点的方法

    DOM(Document Object Modle) 操作文档的编程接口DOM定义了表示和修改文档的方法,不能修改css样式表,在js中使用DOM方法改变元素的css样式,实质上是在元素上添加行间样式 ...

  8. 在WIndowsPhone8 上制作的简单的计算器

    今天,闲着没事,就自己做了一个小小的计算器...虽说自己刚学wp8开发没多长时间,望大神多多指教..1.这是前台页面的代码 <Grid x:Name=" Margin="10 ...

  9. TCP/UDP套接字 java socket编程实例

    网络协议七层结构: 什么是Socket? socket(套接字)是两个程序之间通过双向信道进行数据交换的端,可以理解为接口.使用socket编程也称为网络编程,socket只是接口并不是网络通信协议. ...

  10. 掌握Spark机器学习库-05-spark中矩阵与向量的使用

    1)介绍 矩阵: Matrix,看做二维表,基本运算(+,-,*,T) 向量: Vectors,方向和大小,基本运算,范数 2)spark中向量的使用(主要使用breeze.linalg) 3)spa ...