一,对象实体对比

vue的对象实体依然是html,而react的对象实体已经变味jsx,一种新的语法结构。

vue的html与react的jsx都可以进行拆分,拆分成更细小的组件,组件之间可以传值。

二,生命周期

显然二者都有生命周期概念,生命周期让静态对象实体变为动态实体。

vue的生命周期:

beforeCreate

created

beforeMount

mounted

beforeDestroy

destroyed

react的生命周期

constructor

componentWillMount

render()

componentDidMount

componentWillReceiveProps

shouldComponentUpdate

componentWillUpdata

render()

componentDidUpdate()

componentWillUnmount()

三,修改系统

修改系统第一步是赋值,因为不管是html还是jsx都只是一个结构,没有数据的结构,所以第一步是赋予数据。

赋予数据的方式有

vue

data是数据集合

v-for,v-if,v-show,v-else,v-else-if,v-bind,v-on,refs,{{}},props;

react

在es6中,可以在this.state中产生初始化数据。也可以使用getInitialState设置初始化数据。

绑定数据的方式

{},{{}},refs,props

明显可以看出就专属绑定数据方式而言,vue显然要比react多,原因就在于对象实体的不同。jsx是新的语法结构,可以直接使用js进行操作,因此也就减少了专有属性标签的使用。

绑定数据的部分包含特殊一部分:修改数据的方式。

修改数据发生在两个过程中:不管是vue还是react,生命周期阶段以及事件触发阶段。

vue事件触发主要是v-on,而react就比较厉害了是原生的方式。on-大写事件名称。

此外react的class出于关键字的考虑,改为className,for这个属性改为htmlFor。

本文是vue和react表明功能的初级对比,不足之处还望指出。

Vue于React特性简单对比(一)的更多相关文章

  1. Vue于React特性对比(三)

    最近重学React,再次和vue做了对比. 一,为官方插件提供便利的第三方插件横行 React仅仅是一个ui框架.虽然官方提供了redux,react-router:但也有第三方的redux-thun ...

  2. Vue于React特性对比(二)

    一,关于响应式数据更新方式的实现 1)只有在data里面定义的数据才会有响应式更新 vue依赖的defineProperty的数据劫持加上依赖数据,实现数据的响应式更新.可以称之为依赖式的响应.因为依 ...

  3. Vue于React特性对比(四)

    新开了一个vue的项目,从vue单页面框架搭建到单点登录接入都是自己负责搞的.然后准备将这套东西迁移到react上.然后有了这篇文章. 1,reactjs分环境打包明显要比vue更为麻烦 vue修改的 ...

  4. Vue和React对比

    Vue和React对比 Vue也已经升级到2.0版本了,到现在为止(2016/11/19)比较流行的MVVM框架有AngularJS(也有人认为其为MVC).ReactJS和VueJS,这三个框架中, ...

  5. vue和react全面对比(详解)

    vue和react对比(详解) 放两张图镇压小妖怪 本文先讲共同之处, 再分析区别 大纲在此: 共同点: a.都使用虚拟dom b.提供了响应式和组件化的视图组件 c.注意力集中保持在核心库,而将其他 ...

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

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

  7. Vue与React两个框架的区别对比

    简单介绍 React--Facebook创建的JavaScript UI框架.它支撑着包括Instagram在内的大多数Facebook网站.React与当时流行的jQuery,Backbone.js ...

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

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

  9. Vue 与Angular、React框架的对比

    首先,我们先了解什么是MVX框架模式? MVX框架模式:MVC+MVP+MVVM 1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分 ...

随机推荐

  1. python生成器函数中return的作用

    当生成器函数中含有return时,return不会返回任何值,会直接终止当前生成器,对yield的作用没有影响,当函数执行到return时候,调用next()来执行生成器则会报错,如果使用for循环遍 ...

  2. Python学习 :集合

    集合 Set 集合的创建 集合的创建只有一种方式 集合中的元素必须是不可变的数据类型 集合是无序的,可以通过 for 循环来遍历或者迭代器进行筛选 s=set('xiaoming') s1=['ale ...

  3. Python学习:5.函数以及基础语句

    函数 一.创建函数 Python的函数的学习是Python基础的一个重要部分,函数可以重复利用,减少代码量,接下来我们就学习一下如何创建一个函数,以及函数的使用. 1.创建一个函数的基本格式 def ...

  4. java四种访问权限

    java有四种访问权限,它们各自的范围如下图所示 当下列访问修饰符修饰字段和方法时: private 任意位置的子类不可以访问从父类继承的private字段和方法.这里所说的访问包括通过super关键 ...

  5. Codevs1332_上白泽慧音_KEY

    题目传送门 裸的模板题,Tarjan求联通量.  code: #include <cstdio> #include <vector> #define min(a,b) a< ...

  6. CF 600 E. Lomsat gelral

    E. Lomsat gelral http://codeforces.com/contest/600/problem/E 题意: 求每个子树内出现次数最多的颜色(如果最多的颜色出现次数相同,将颜色编号 ...

  7. NB-IOT连接移动onenet平台流程

    1. 先创建账号,然后创建产品 2. 创建设备,用AT+CGSN和AT+CIMI查询NB-IOT的IMEI和IMSI填写上去. 3. 创建好的设备.

  8. 鸡啄米:C++编程之十四学习之构造函数和析构函数

    1. 本人学习鸡啄米课程的笔记记录,用来记录学习的历程和进度 2. 构造函数 我们在声明一个变量时,如果对它进行了初始化,那么在为此变量分配内存空间时还会向内存单元中写入变量的初始化.声明对象有相似的 ...

  9. JS日期转换

    用js将从后台得到的时间戳(毫秒数)转换为想要的日期格式 得到后台从数据库中拿到的数据我们希望格式是 2016年10月25日 17时37分30秒 或者 2016/10/25 17:37:30 然而我们 ...

  10. 面试遇到的订单表sql的解决方案

    对于以下需求:用户表:users (user_id  int)订单表:order_tb(user_id int, or_time  date, or_money double)求以下用户:一月下过单, ...