首先,我们先了解什么是MVX框架模式?

MVX框架模式:MVC+MVP+MVVM

1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分开。

View通过Controller来和Model联系,Controller是View和Model的协调者,View和Model不直接联系,基本联系都是单向的。

用户User通过控制器Controller来操作模板Model从而达到视图View的变化。

2.MVP:是从MVC模式演变而来的,都是通过Controller/Presenter负责逻辑的处理+Model提供数据+View负责显示。

在MVP中,Presenter完全把View和Model进行了分离,主要的程序逻辑在Presenter里实现。

并且,Presenter和View是没有直接关联的,是通过定义好的接口进行交互,从而使得在变更View的时候可以保持Presenter不变。

MVP模式的框架:Riot,js。

3.MVVM:MVVM是把MVC里的Controller和MVP里的Presenter改成了ViewModel。Model+View+ViewModel。

View的变化会自动更新到ViewModel,ViewModel的变化也会自动同步到View上显示。

这种自动同步是因为ViewModel中的属性实现了Observer,当属性变更时都能触发对应的操作。

MVVM模式的框架有:AngularJS+Vue.js和Knockout+Ember.js后两种知名度较低以及是早起的框架模式。

Vue.js是什么?

看到了上面的框架模式介绍,我们可以知道它是属于MVVM模式的框架。那它有哪些特性呢?

其实Vue.js不是一个框架,因为它只聚焦视图层,是一个构建数据驱动的Web界面的库。

Vue.js通过简单的API(应用程序编程接口)提供高效的数据绑定和灵活的组件系统。

Vue.js的特性如下:

1.轻量级的框架

2.双向数据绑定

3.指令

4.插件化

Vue.js与其他框架的区别?

1.与AngularJS的区别

相同点:

都支持指令:内置指令和自定义指令。

都支持过滤器:内置过滤器和自定义过滤器。

都支持双向数据绑定。

都不支持低端浏览器。

不同点:

1.AngularJS的学习成本高,比如增加了Dependency Injection特性,而Vue.js本身提供的API都比较简单、直观。

2.在性能上,AngularJS依赖对数据做脏检查,所以Watcher越多越慢。

Vue.js使用基于依赖追踪的观察并且使用异步队列更新。所有的数据都是独立触发的。

对于庞大的应用来说,这个优化差异还是比较明显的。

2.与React的区别

相同点:

React采用特殊的JSX语法,Vue.js在组件开发中也推崇编写.vue特殊文件格式,对文件内容都有一些约定,两者都需要编译后使用。

中心思想相同:一切都是组件,组件实例之间可以嵌套。

都提供合理的钩子函数,可以让开发者定制化地去处理需求。

都不内置列数AJAX,Route等功能到核心包,而是以插件的方式加载。

在组件开发中都支持mixins的特性。

不同点:

React依赖Virtual DOM,而Vue.js使用的是DOM模板。React采用的Virtual DOM会对渲染出来的结果做脏检查。

Vue.js在模板中提供了指令,过滤器等,可以非常方便,快捷地操作DOM。

如何使用Vue.js?

1.安装

(1)script

如果项目直接通过script加载CDN文件,代码示例如下:

<script src="http://webapp.didistatic.com/static/webapp/shield/z/vue/vue/1.0.24/vue.min.js"></script>

(2)npm

如果项目给予npm管理依赖,则可以使用npm来安装Vue,执行如下命令:

$npm i vue --save-dev

(3)bower

如果项目基于bower管理依赖,则可以使用bower来安装Vue,执行如下命令:

$bower i vue --save-dev

推荐另一篇官方文档,希望有帮助:http://www.cnblogs.com/hubgit/p/8010560.html

Vue 与Angular、React框架的对比的更多相关文章

  1. Vue.js与React的全面对比

    Vue与React的对比 Vue.js与React.js从某些反面来说很相似,通过两个框架的学习,有时候对一些用法会有一点思考,为加深学习的思索,特翻阅了两个文档,从以下各方面进行了对比,加深了对这两 ...

  2. 关于vue,angularjs1,react之间的对比

    1.时间投入的问题:相对于react和angularjs,学习vue的时间成本低,而且容易上手. 2.JSX的可读性比较一般.代码的可读性不如vue,当然,vue也支持jsx,但是vue更提倡temp ...

  3. 关于Vue的理解以及与React框架的对比

    1.Vue的理解 概念: Vue是一套用于构建用户界面的渐进式框架: Vue的核心库只关注视图层: 是一个数据驱动的MVVM框架: 特性: 确实轻量:体积比较小: 数据绑定简单.方便: 有一些简单的内 ...

  4. 前端三大主流框架的对比React、Vue、Angular

    前端三大主流框架的对比React.Vue.Angular React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站, 并于 2013年 5 月开源.React 拥有较高的 ...

  5. 技术趋势:React vs Vue vs Angular

    React.Vue 和 Angular 这两年发展状况如何?2019 年哪个技术最值得学习? 前几天 Medium 上有一位作者发表了一篇关于 React.Vue 和 Angular 技术趋势的文章( ...

  6. Jenkins gitlab vue,angular,react 自动化构建【原】

    大致思路,(本篇主要讲vue ,当然了 angular react 也是一样配置) ,转发请注明原链接,谢谢 :) 1. 服务器上面配置jenkins (安装配置,不介绍) 2.新建item 自由风格 ...

  7. vue、react、angular三大框架对比 && 与jQuery的对比

    前端当前最火的三大框架当属vue.react以及angular了. 但是在做项目的时候,我们怎么去选择呢?  这里做一个比较,希望大家可以有一个比较清晰的认识. vue与react vue和react ...

  8. vue,angular,react框架对比

    转载自:https://www.cnblogs.com/hubgit/p/6633214.html 首先,我们先了解什么是MVX框架模式? MVX框架模式:MVC+MVP+MVVM 1.MVC:Mod ...

  9. vue、react、angular三大框架对比

    前端的三大框架当属vue.react以及angular了,个人比较偏向react,它的社区比较繁荣,有很多丰富的组件 .angular的话感觉编译时间有点长,等待很恼火. vue与react vue和 ...

随机推荐

  1. Python标准库之time和datetime

    注:博客转载自:https://www.cnblogs.com/zhangxinqi/p/7687862.html 1.python3日期和时间 Python 程序能用很多方式处理日期和时间,转换日期 ...

  2. python3.x 函数的参数

    2016-08-09  15:06:18 位置参数 调用函数时,参数按照位置依次传递给函数 def show(a1,a2,a3,a4): print(a1,a2,a3,a4) show('s','h' ...

  3. 剑指offer-第三章高质量代码(反转链表)

    题目:定义一个函数,输入一个链表的头节点,反转该链表并输出反转链表的头节点. 思路:对一个链表反转需要三个指针操作来保证链表在反转的过程中保证不断链,给链表一个行动指针pNode,对pNode指向的节 ...

  4. OracleAWR删除历史快照说明

    测试时,发现无法产生新快照,查看系统时间为10月26,但是已经产生快照为12月1号了. 此时的解决办法,就是删除现有的快照. 转http://itlab.idcquan.com/Oracle/back ...

  5. Java Integer和String内存存储

    标签: java内存string 2016-01-10 12:51 1545人阅读 评论(2) 收藏 举报  分类: Java(7)  版权声明:本文为博主原创文章,未经博主允许不得转载. 先看代码: ...

  6. 参数化防SQL注入

    private void AddStudent(){ string strName =txtName.Text.Trim(); string strPwd = txtPwd.Text.Trim(); ...

  7. FPGA噪声干扰

    在FPGA高速AD采集设计中,PCB布线差会产生干扰.今天小编为大家介绍一些布线解决方案. 1.信号线的等长 以SDRAM或者DDRII为例,数据线,命令线,地址线以及时钟线最好等长,误差不要超过50 ...

  8. HTTP重要概念

    connection连接 一个传输层的实际环流,它是建立在两个相互通讯的应用程序之间. 在http1.1,request和reponse头中都有可能出现一个connection的头,此header的含 ...

  9. 【转】理解JMeter聚合报告(Aggregate Report)

    Aggregate Report 是 JMeter 常用的一个 Listener,中文被翻译为“聚合报告”.今天再次有同行问到这个报告中的各项数据表示什么意思,顺便在这里公布一下,以备大家查阅. 如果 ...

  10. 接口规范,js处理json,php返回给ajax的数据格式

    ajax异步获取php数据. 一般php会在后台处理请求,并返回结果给前端. 必须是echo的方式,不然ajax获取不到. 返回的类型包括,字符串,数字,json. 最常用的就是json. 返回后,前 ...