vue mvc与mvvm
一、什么是MVVM?
MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑;View 代表UI 组件,它负责将数据模型转化成UI 展现出来,ViewModel 是一个同步View 和 Model的对象(桥梁)。
在MVVM架构下,View 和 Model 之间并没有直接的联系,而是通过ViewModel进行交互,Model 和 ViewModel 之间的交互是双向的, 因此View 数据的变化会同步到Model中,而Model 数据的变化也会立即反应到View 上。
ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来,而View 和 Model 之间的同步工作完全是自动的,无需人为干涉,因此开发者只需关注业务逻辑,不需要手动操作DOM, 不需要关注数据状态的同步问题,复杂的数据状态维护完全由 MVVM 来统一管理。
二、mvvm和mvc区别?它和其它框架(jquery)的区别是什么?哪些场景适合?
mvc和mvvm其实区别并不大。都是一种设计思想。主要就是mvc中Controller演变成mvvm中的viewModel。mvvm主要解决了mvc中大量的DOM 操作使页面渲染性能降低,加载速度变慢,影响用户体验。
区别:vue数据驱动,通过数据来显示视图层而不是节点操作。
场景:数据操作比较多的场景,更加便捷
三、vue的优点是什么?
· 低耦合。视图(View)可以独立于Model变化和修改,一个ViewModel可以绑定到不同的"View"上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。
· 可重用性。你可以把一些视图逻辑放在一个ViewModel里面,让很多view重用这段视图逻辑。
· 独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计。
· 可测试。界面素来是比较难于测试的,而现在测试可以针对ViewModel来写。
vue mvc与mvvm的更多相关文章
- 架构模式:MVC与MVVM
本文探讨如下几个问题: 什么是MVC 什么是MVVM MVC与MVVM对架构属性的影响 MVC实例SpringMVC MVVM实例Vue MVC.MVVM与Layer中的Model,Controlle ...
- 前端mvc mvp mvvm 架构介绍(vue重构项目一)
首先 我们为什么重构这个项目 1:我们现有的技术是前后台不分离,页面上采用esayUI+jq构成的单页面,每个所谓的单页面都是从后台胜场的唯一Id 与前端绑定,即使你找到了那个页面元素,也找不到所在的 ...
- 浅析前端开发中的 MVC/MVP/MVVM 模式
MVC,MVP和MVVM都是常见的软件架构设计模式(Architectural Pattern),它通过分离关注点来改进代码的组织方式.不同于设计模式(Design Pattern),只是为了解决一类 ...
- MVC和MVVM
MVC和MVVM的qu'bie 1. Mvvm定义MVVM是Model-View-ViewModel的简写.即模型-视图-视图模型.[模型]指的是后端传递的数据.[视图]指的是所看到的页面.[视图模型 ...
- Vue.js 和 MVVM 的小细节
Vue.js 和 MVVM 的小细节 转载 作者:流云诸葛 链接:www.cnblogs.com/lyzg/p/6067766.html MVVM 是Model-View-ViewModel 的缩写, ...
- MVC MVP MVVM 图解
1.MVC (1)图解 解释: 视图(View):用户界面. 控制器(Controller):业务逻辑 模型(Model):数据保存 各部分之间的通信方式如下: View 传送指令到 Controll ...
- Vue01 vue基础、mvvm、ES6z知识点、计算属性、生命周期
Vue案例: <body> <div id="app"> <!--第一部分--> <fieldset> <legend> ...
- MVC和MVVM的区别
现在是市面上使用MVVM模型越来越多,相关的前端框架的选择也相应增多. 那么什么是MVVM模型,它和传统MVC模型有什么区别,接下来我们来总结探讨一下. MVVM即Model-View-ViewMod ...
- 浅谈MVC、MVVM的区别
一.概述 MVC,MVP,MVVM是三种常见的前端架构模式(Architectural Pattern),它通过分离关注点来改进代码组织方式.不同于设计模式(Design Pattern),只是为了解 ...
随机推荐
- Hello Wolrd
这是一篇测试文章.....后续会更新一些文章.
- 学习PDO中的错误与错误处理模式
在 PDO 的学习过程中,我们经常会在使用事务的时候加上 try...catch 来进行事务的回滚操作,但是大家有没有注意到默认情况下 PDO 是如何处理错误语句导致的数据库操作失败问题呢?今天,我们 ...
- 腾讯云启动jenkins
首先配置后jdk环境 可参考:https://www.cnblogs.com/Uni-Hoang/p/12991686.html 下载jenkins的war包 在/usr/local/创建一个jenk ...
- Java安全之 ClassLoader类加载器
Java安全之 ClassLoader类加载器 0x00 前言 前面这里抛出一个问题,Java到底是什么类型的编程语言?是编译型?还是解释型?在这个问题是其实一直都都有疑惑,如果说是解释型语言的话,那 ...
- Git:分布式版本控制系统
参考廖雪峰的 Git 教程:https://www.liaoxuefeng.com/wiki/896043488029600 讲解很详细,这里只做一些个人笔记: 各系统安装 Git :https:/ ...
- USACO Section 4
前言 好久没更新这个系列了,最近闲的无聊写一下.有两题搜索懒得写了. P2737 [USACO4.1]麦香牛块Beef McNuggets https://www.luogu.com.cn/probl ...
- Winform 空闲时间(鼠标键盘无操作)
前言 Winform 在特定情况下,需要判断软件空闲时间(鼠标键盘无操作),然后在做一下一些操作. 实现 做了一个简单的例子,新建一个窗体,然后拖两个控件(Timer控件和label控件) using ...
- AOJ/高等排序习题集
ALDS1_5_B-MergeSort. Description: Write a program of a Merge Sort algorithm implemented by the follo ...
- python简单操作excel
python操作excel 写入excel # 写入excel import xlwt # 创建xls对象 wb = xlwt.Workbook() # 新增两个表单页(sheet1) sh1 = w ...
- 开源框架 - 新 代码生成器 WebFirst / .NET Core
框架描述 WebFirst 是一新代的 代码生成器,用法简单,功能强大,支持多种数据库 ,具体功能如下: 一. 建库.CodeFirst方式在线建表,没用到CodeFirst的用户可以用工具轻松体验 ...