zoukankan      html  css  js  c++  java
  • react生命周期的理解

    在做了这么多的React的需求之后,我意识到,自己对于react的了解真的只是浮于表面,没有深入理解内部的原理,今天又细细学习了关于生命周期的一些概念和原理:

    React声明周期的四个大阶段:

    1. Initialization:初始化阶段。
    2. Mounting: 挂在阶段。
    3. Updation: 更新阶段。
    4. Unmounting: 销毁阶段
    componentWillMount----组件将要挂载到页面的时刻执行
    render----开始挂载渲染
    componentDidMount----组件挂载完成的时刻执行
    shouldComponentUpdate---组件发生改变前执行
    componentWillUpdate---组件更新前,shouldComponentUpdate函数之后执行
    render----开始挂载渲染
    componentDidUpdate----组件更新之后执行

    生命周期函数指在某一个时刻组件会自动调用执行的函数

    开发阶段主要用到的生命周期的一些函数:

    挂载阶段:componentWillMount,componentDidMount

    组件更新阶段:shouldComponentUpdate(这个函数还可以用来进行性能优化),componentWillUpdate,componentDidUpdate

    销毁阶段:componentWillUnmount

    另外还有一个componentWillReceiveProps 表示子组件接受父组件传递过来的参数,父组件render函数重新执行的时候触发

    上面所提到的优化页面性能,减少render刷新的次数还可以利用shouldComponentUpdate函数

    1 shouldComponentUpdate(nextProps,nextState){
    2     if(nextProps.content !== this.props.content){
    3         return true
    4     }else{
    5         return false
    6     }
    7 }
    想要这样一间小木屋,夏天挫冰吃瓜,冬天围炉取暖.
  • 相关阅读:
    浅谈前端的CSS
    浅谈前端的HTML
    python操作mysql
    简单的sql题目和解答
    子查询&视图&事务
    测试程序运行的时间
    API接口简单的写法
    数据库数据进行量化算法入库
    正则爬取二手房数据
    接口加密和破解
  • 原文地址:https://www.cnblogs.com/lianer88/p/11005058.html
Copyright © 2011-2022 走看看