• react生命周期


    组件载入阶段:
    componentWillMount:组件即将被装载、渲染到页面上,只调用1次
    componentDidMount:组件真正在被装载之后,这里可以拿到真实DOM执行操作,只调用1次

    运行中状态:
    componentWillReceiveProps(nextProps):组件将要接收到新属性的时候调用,在这时setState不会触发额外的render,因为此时已经有一次来自父组件引发的render了。

    shouldComponentUpdate:组件接受到新属性或者新状态的时候(返回 false,接收数据后不更新,阻止 render ,后面的函数不会继续执行)
    componentWillUpdate:组件即将更新不能修改属性和状态
    componentDidUpdate:组件已经更新

    销毁阶段:
    componentWillUnmount:组件即将销毁,这时候可以销毁绑定的事件监听或者定时器什么的。

    React中的props和state的用法

    state 是一种数据结构,用于组件挂载时所需数据的默认值。state 可能会随着时间的推移而发生突变,但多数时候是作为用户事件行为的结果。
    Props则是组件的配置。props 由父组件传递给子组件,并且就子组件而言,props 是不可变的(immutable)

    react组件之间如何通信

    父子:父传子:props; 子传父:子调用父组件中的函数并传参;
    兄弟:利用redux实现。 
    所有关系都通用的方法:利用PubSub.js订阅

    react的setState的原理及用法

    原理:当调用setState时,它并不会立即改变,而是会把要修改的状态放入一个任务队列,等到事件循环结束时,再合并指更新。
    因此,setState有 异步,合并更新更新两个特性。

    使用:
    1.最常见的用法就是传入一个对象。

    this.setState({
       isLoading:false
    })

    2.还可以接收一个函数

    this.setState((prevState,props)=>{
        // 要做的事件
        return {isLoading:false};
    })

    3.因为setState是异步的,所以它还可以接收第二个参数,一个回调函数

    this.setState({count:2},()=>{
        isLoading:this.state.count===2 ? true : false
    })

    react与vue的对比

    
    
    相同点:
    1. 都用虚拟DOM实现快速渲染
    2. 我觉得父子,兄弟通信这些都挺像的,也都有自己的状态管理器:react=>redux, vue=>vuex
    3. 都是轻量级框架
    4. 现在vue也在渐渐吸收react中的一些语法,比如JSX语法,类式声明写法等
    不同点:
    1. React属于单向数据流——MVC模式,vue则属于双向——MVVM模式。 2. react兼容性比vue好,vue不兼容IE8. 3. react采用JSX语法,vue采用的则是html模板语法。 4. vue的css可以有组件的私有作用域,react则没有。 5. react比vue好的另一点是,它是团队维护,而vue属于个人,一般来说,大型项目更倾向于react,小型则用vue,当然这也不是绝对。
    
    
    
    
    

     








  • 相关阅读:
    作诗(si)[分块]
    【洛谷 P3469】[POI2008]BLO-Blockade(割点)
    【洛谷 P2464】[SDOI2008]郁闷的小J(线段树)
    【BZOJ 3907】网格(Catalan数)
    【洛谷 P4211】[LNOI2014]LCA(树链剖分,差分)
    【洛谷 P2480】 [SDOI2010]古代猪文(中国剩余定理,Lucas定理)
    【洛谷 P3842】[TJOI2007]线段(DP)
    【洛谷 P2346】四子连棋(状态压缩,搜索)
    【洛谷 P1363】幻想迷宫(搜索)
    【洛谷 P1364】医院设置(树的重心)
  • 原文地址:https://www.cnblogs.com/tuspring/p/12176046.html
Copyright © 2020-2023  润新知