一 Vue 是什么?
vue.js是一个用于创建用户界面的开源JavaScript框架,也是一个创建单页面的应用的Web框架。Vue所关注的核心是MVC模式中的视图层,同时,它也能方便的获取数据更新,并通过组件内部特定的方法实现视图与模型的交互。
二 Vue核心特性
数据驱动 (MVVM)
MVVM表示的是 Model-View-ViewModel
- Model 模型层,负责处理业务逻辑以及和服务端进行交互
- View 视图层, 负责将数据模型转化为UI展示出来 可以理解为HTML页面
- ViewModel 视图模型层 用来连接Model和View,是Model和View之间的通信桥梁。
组件化
1.组件化就是把图形、非图形的各种逻辑均抽象为一个统一的概念(组件)来实现开发的模式,在vue中每一个.vue文件都可以视为一个组件。
2.组件化的优势
- 降低整个系统的耦合度,在保持接口不变的情况下,我们可以替换不同的组件快速完成需求。
- 调试方便,由于整个系统是通过组件组合起来的,在出现问题时,可以用排除法直接移除组件,或根据报错的组件快速定位问题,之所以能够快速定位,是因为每个组件之间低耦合,职责单一,所以逻辑会比较分析整个系统要简单
- 提高可维护性, 由于每个组件的职责单一,并且组件在系统中是被复用的,所以对代码进行优化可获得系统的整体升级。
3.指令系统
指令(Directives)是有带v-前缀的特殊属性作用:当表达式的值改变时,将产生的连带影响,响应式的作用域于DOM。
常用的指令
- 条件渲染指令 v-if
- 列表渲染指令 v-for
- 属性绑定指令 v-bind
- 事件绑定指令 v-on
- 双向数据绑定指令 v-model
没有指令之前,我们是要先获取到DOM,然后再做相应的操作....
三 Vue和传统开发的区别
1.Vue所有的界面事件,都只是去操作数据的;
2.Vue所有界面的变动,都是根据数据自动绑定出来的。
四 Vue和React的区别
相同点
- 都有组件化思想
- 都支持服务器端渲染
- 都有Virtual DOM
- 数据驱动视图
- 都有支持的native (vue的weex, react的React-native)
- 都有自己的构建工具 (vue的vue-cli, react的Create React App)
不同点
- 数据的流向不同。react推崇单项数据流 vue是双向数据流
- 数据变化的实现原理不同。 react使用的是不可能变数 vue使用的是可变的数据
- 组件化通信不同。 react中 我们通过使用回调函数来进行通信的。 Vue中子组件向父组件传递消息有两种: 事件和回调函数;
- diff算法不同。react主要使用diff队列保存需要更新哪些DOM,得到patch树,再统一操作批量更新DOM。Vue使用双向指针,边对比 边更新 DOM。