• 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表明功能的初级对比,不足之处还望指出。

    对比二跳转:https://www.cnblogs.com/zhensg123/p/9460390.html

  • 相关阅读:
    课上作业
    大道至简第四章读后感
    课上作业
    读大道至简第三章感想
    关于外部引用JS,中文乱码的问题
    HTML5 之Canvas绘制太阳系
    HTML5 之Canvas 绘制时钟 Demo
    JQuery仿淘宝商家后台管理 之 管理添加分类
    分页存储过程的几种写法
    Javascript-do_while....
  • 原文地址:https://www.cnblogs.com/zhensg123/p/9283076.html
Copyright © 2020-2023  润新知