一、什么是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 来统一管理。

二、mvvmmvc区别?它和其它框架(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的更多相关文章

  1. 架构模式:MVC与MVVM

    本文探讨如下几个问题: 什么是MVC 什么是MVVM MVC与MVVM对架构属性的影响 MVC实例SpringMVC MVVM实例Vue MVC.MVVM与Layer中的Model,Controlle ...

  2. 前端mvc mvp mvvm 架构介绍(vue重构项目一)

    首先 我们为什么重构这个项目 1:我们现有的技术是前后台不分离,页面上采用esayUI+jq构成的单页面,每个所谓的单页面都是从后台胜场的唯一Id 与前端绑定,即使你找到了那个页面元素,也找不到所在的 ...

  3. 浅析前端开发中的 MVC/MVP/MVVM 模式

    MVC,MVP和MVVM都是常见的软件架构设计模式(Architectural Pattern),它通过分离关注点来改进代码的组织方式.不同于设计模式(Design Pattern),只是为了解决一类 ...

  4. MVC和MVVM

    MVC和MVVM的qu'bie 1. Mvvm定义MVVM是Model-View-ViewModel的简写.即模型-视图-视图模型.[模型]指的是后端传递的数据.[视图]指的是所看到的页面.[视图模型 ...

  5. Vue.js 和 MVVM 的小细节

    Vue.js 和 MVVM 的小细节 转载 作者:流云诸葛 链接:www.cnblogs.com/lyzg/p/6067766.html MVVM 是Model-View-ViewModel 的缩写, ...

  6. MVC MVP MVVM 图解

    1.MVC (1)图解 解释: 视图(View):用户界面. 控制器(Controller):业务逻辑 模型(Model):数据保存 各部分之间的通信方式如下: View 传送指令到 Controll ...

  7. Vue01 vue基础、mvvm、ES6z知识点、计算属性、生命周期

    Vue案例: <body> <div id="app"> <!--第一部分--> <fieldset> <legend> ...

  8. MVC和MVVM的区别

    现在是市面上使用MVVM模型越来越多,相关的前端框架的选择也相应增多. 那么什么是MVVM模型,它和传统MVC模型有什么区别,接下来我们来总结探讨一下. MVVM即Model-View-ViewMod ...

  9. 浅谈MVC、MVVM的区别

    一.概述 MVC,MVP,MVVM是三种常见的前端架构模式(Architectural Pattern),它通过分离关注点来改进代码组织方式.不同于设计模式(Design Pattern),只是为了解 ...

随机推荐

  1. 深入浅出 BPF TCP 拥塞算法实现原理

    本文地址:https://www.ebpf.top/post/ebpf_struct_ops 1. 前言 eBPF 的飞轮仍然在快速转动,自从 Linux 内核 5.6 版本支持 eBPF 程序修改 ...

  2. PHP中的国际化日历类

    在 PHP 的国际化组件中,还有一个我们并不是很常用的跟日期相关的操作类,它就是日历操作类.说是日历,其实大部分还是对日期时间的操作,一般也是主要用于日期的格式化和比较之类的.但是通常我们直接使用 d ...

  3. js判断移动端跳转

    <script type="text/javascript">if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) | ...

  4. 使用ELK监控Nginx日志实现接口流量访问统计

    前段时间自己看书学习了一下elasticSearch,后面自己实践了使用elasticSearch.logStash.kibana搭建一个网站接口流量访问统计的监控看板.在这里做一些记录学习. 先看一 ...

  5. js模块化开发 AMD CMD Commonjs

    在es6全面实行开来之前  js实现模块开发方案有: 1.AMD 异步模块开发定义  依赖前置,requireJs应用了这一规范 require([module], callback); 加载完后回调 ...

  6. P4783-[模板]矩阵求逆

    正题 题目链接:https://www.luogu.com.cn/problem/P4783 题目大意 给出一个矩阵,求它的逆矩阵. \(1\leq n\leq 400\) 解题思路 记给出矩阵\(P ...

  7. P4249-[WC2007]剪刀石头布【费用流】

    正题 题目链接:https://www.luogu.com.cn/problem/P4249 题目大意 \(n\)个点的竞赛图有的边已经确定了方向,要求给剩下的边确定一个方向使得图的三元环最多. \( ...

  8. P5110-块速递推【特征方程,分块】

    正题 题目链接:https://www.luogu.com.cn/problem/P5110 题目大意 数列\(a\)满足 \[a_n=233a_{n-1}+666a_{n-2},a_0=0,a_1= ...

  9. ❤️Python接口自动化,一文告诉你连接各大【数据库】建议收藏❤️

    @ 目录 前言 常见数据库 Mysql Oracle sql-server PostgreSQL MongoDB Redis 前言 相信很多小伙伴在使用python进行自动化测试的时候,都会涉及到数据 ...

  10. NOIP 模拟六 考试总结

    T1辣鸡 T1就搞得这莫不愉快.. 大致题意是给你几个矩形,矩形覆盖的点都标记上,每个矩形无重复部分,求满足(x,y) (x+1,y+1)都标记过的点对数,范围1e9. 看起来很牛的样子,我确实也被1 ...