一、什么是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. symfony2已有数据表导入实体时报错 Doctrine does not support reverse engineering from tables that don't have a primary key

    先在配置文件 app/config/config.yml中配置 schema_filter: /^(?!(tablename))/ 即可,或者在出现问题表都加上一个id 然后再使用命令 php app ...

  2. 织梦Call to a member function GetInnerText() on string

    "include"-"customfields.func.php"文件,在第539行中把以下代码: $fvalue = trim($ntag->GetIn ...

  3. Shell系列(14)- declare声明变量

    declare声明变量类型 格式 declare [+/-] [选项] [变量名] 选项 -:给变量设定类型属性 +:取消变量的类型属性 -a :将变量声明为数组型 -i :将变量声明为整数型(int ...

  4. win10系统显示此电脑

    今天电脑开机后发现从任务栏进入"文件资源管理器",直接卡死,重启电脑也没有用. 我想到是不是从"此电脑"进入不会卡死,试了一下果真没有卡死. 使用win10系统 ...

  5. FastAPI logger日志记录方案 loguru模块

    实现方式: 采用 loguru 模块.跟flask直接挂载到app上有区别,当然也可以尝试去这样做. 但是 好像没有这个必要.要的就是个快速.整那些子虚乌有的东西完全木有意义. 1.首先是去项目git ...

  6. 『Python』matplotlib的imshow用法

    热力图是一种数据的图形化表示,具体而言,就是将二维数组中的元素用颜色表示.热力图之所以非常有用,是因为它能够从整体视角上展示数据,更确切的说是数值型数据. 使用imshow()函数可以非常容易地制作热 ...

  7. 深入理解Python切片

    Python序列的切片很基础同时也很重要,最近看到一个[::-1]的表达,不明所以,查了一些资料并实际操作,对Python切片有了更深刻的认识,以下结合例子详细说明.先看下切片的基本语法,一般认为切片 ...

  8. windows terminal+wsl+neovim配置过程杂记

    长期记录,草稿 coc依赖于node,直接sudo apt intsll node得到的版本是10.x,无法满足要求, 这篇博客介绍了安装新版node的方法https://www.cnblogs.co ...

  9. 反调试--CRC检测

    #include"CRC32.h" #include<Windows.h> #include<iostream> using namespace std; ...

  10. 洛谷 P1862 输油管道问题

    题意 题目链接:P1862 输油管道问题 不难看出每个油井的 \(x\) 坐标是没用的,所以问题转化为如下. 代数意义:给出 \(n\) 个数 \(y_1,y_2,\ldots,y_n\),找一个数 ...