Vue 及 Vue理解

一 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。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值