Vue于React特性简单对比(一)
一,对象实体对比
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特性简单对比(一)的更多相关文章
- Vue于React特性对比(三)
最近重学React,再次和vue做了对比. 一,为官方插件提供便利的第三方插件横行 React仅仅是一个ui框架.虽然官方提供了redux,react-router:但也有第三方的redux-thun ...
- Vue于React特性对比(二)
一,关于响应式数据更新方式的实现 1)只有在data里面定义的数据才会有响应式更新 vue依赖的defineProperty的数据劫持加上依赖数据,实现数据的响应式更新.可以称之为依赖式的响应.因为依 ...
- Vue于React特性对比(四)
新开了一个vue的项目,从vue单页面框架搭建到单点登录接入都是自己负责搞的.然后准备将这套东西迁移到react上.然后有了这篇文章. 1,reactjs分环境打包明显要比vue更为麻烦 vue修改的 ...
- Vue和React对比
Vue和React对比 Vue也已经升级到2.0版本了,到现在为止(2016/11/19)比较流行的MVVM框架有AngularJS(也有人认为其为MVC).ReactJS和VueJS,这三个框架中, ...
- vue和react全面对比(详解)
vue和react对比(详解) 放两张图镇压小妖怪 本文先讲共同之处, 再分析区别 大纲在此: 共同点: a.都使用虚拟dom b.提供了响应式和组件化的视图组件 c.注意力集中保持在核心库,而将其他 ...
- Vue.js与React的全面对比
Vue与React的对比 Vue.js与React.js从某些反面来说很相似,通过两个框架的学习,有时候对一些用法会有一点思考,为加深学习的思索,特翻阅了两个文档,从以下各方面进行了对比,加深了对这两 ...
- Vue与React两个框架的区别对比
简单介绍 React--Facebook创建的JavaScript UI框架.它支撑着包括Instagram在内的大多数Facebook网站.React与当时流行的jQuery,Backbone.js ...
- vue、react、angular三大框架对比 && 与jQuery的对比
前端当前最火的三大框架当属vue.react以及angular了. 但是在做项目的时候,我们怎么去选择呢? 这里做一个比较,希望大家可以有一个比较清晰的认识. vue与react vue和react ...
- Vue 与Angular、React框架的对比
首先,我们先了解什么是MVX框架模式? MVX框架模式:MVC+MVP+MVVM 1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分 ...
随机推荐
- Hive(4)-Hive的数据类型
一. 基本数据类型 Hive数据类型 Java数据类型 长度 例子 TINYINT byte 1byte有符号整数 20 SMALINT short 2byte有符号整数 20 INT int 4by ...
- HDFS的JavaAPI
配置windows平台的Hadoop环境 在 windows 上做 HDFS 客户端应用开发,需要设置 Hadoop 环境,而且要求是windows 平台编译的 Hadoop,不然会报以下的错误: F ...
- python闭包的概念及使用
闭包:在函数里定义了另外一个函数(函数嵌套),内函数里运用了外函数的变量,外函数返回内函数的函数引用(函数名). nonlocal 的使用:闭包内部函数可直接调用外部函数的变量,如果修改需要使用non ...
- Redis的n种妙用,不仅仅是缓存
redis是键值对的数据库,常用的五种数据类型为字符串类型(string),散列类型(hash),列表类型(list),集合类型(set),有序集合类型(zset) Redis用作缓存,主要两个用途: ...
- IoC 依赖注入容器 Unity
原文:IoC 依赖注入容器 Unity IoC 是什么? 在软件工程领域,“控制反转(Inversion of Control,缩写为IoC)”是一种编程技术,表述在面向对象编程中,可描述为在编译时静 ...
- JS学习 用 arguments 对象模拟函数重载
用 arguments 对象判断传递给函数的参数个数,即可模拟函数重载: function doAdd() { if(arguments.length == 1) { alert(arguments[ ...
- 安装虚拟机以及ubuntu
近期要用到linux,所以开始学习.想要在这里记录自己的学习之路 1.安装虚拟机以及装ubuntu系统 虚拟机就相当于一台电脑,电脑里得有系统,我们选择了ubuntu作为操作系统. 安装看下面的博客操 ...
- 「日常训练&知识学习」树的分块(王室联邦,HYSBZ-1086)
题意与分析 这题的题意就是树分块,更具体的看题目(中文题). 学习这一题是为了树的分块,为树上莫队做铺垫. 参考1:https://blog.csdn.net/LJH_KOQI/article/det ...
- 敏捷开发学习笔记-Agile development(AM)
以人为核心,迭代,循序渐进 项目被切分为多个子项目,每个子项目都经过测试,具备集成和可运行的特征 5个价值观:沟通.简单.反馈.勇气.谦逊 敏捷模型与瀑布模型的区别 相对于瀑布模型,提高开发效率和 ...
- Linux命令应用大词典-第43章iptables和arptables防火墙
43.1 iptables-save:保存iptables规则 43.2 iptables-restore:恢复iptables规则 43.3 iptables:IPv4数据包过滤和NAT管理工具 4 ...