zoukankan      html  css  js  c++  java
  • React 16版本的生命周期

     

    1. 初始化阶段 - 自动执行

      1. constructor(props) 通过super继承父组件属性,然后赋值给this.props 定义状态 绑定事件this

      2. componentWillMount 获取属性和状态,可以发送请求,修改数据

      3. render 生成vdom 用来计算 this.props this.state 不能使用setState,是一个纯函数,必须有返回值

      4. componentDidMount 可以发送数据请求和数据修改 - 可以获取并操作真实DOM

    2. 更新阶段 - 数据改变

      1. componentWillReceiveProps(nextProps) [ 属性改变才执行 ] 接收新属性, 判断组件属性是否改变,可以用于监听 this.props是旧属性, this.props != nextProps 说明数据发生改变了

      2. shouldComponentUpdate 可以优化组件性能的关键钩子函数, 控制组件是否要更新 返回值为true/false(true表示更新,false表示不更新)

      3. componentWillUpdate 表示组件即将更新 作用:为更新做准备,里面不可以执行setState

      4. render 当数据改变之后再一次生成VDOM,用于计算this.props和this.state

      5. componentDidUpdate 获得了更新后的真实dom,可以操作真实dom,可以进行第三方库的实例化,此钩子不能执行setState

    3. 销毁阶段

      1. componentWillUnmount 组件销毁, 善后,比如清除计时器、滚动事件、第三方库实例化出来的实例

    4. 错误处理阶段

      componentDidCatch

      1. 记录错误信息和错误栈 、

      2. 功能实现降级UI

  • 相关阅读:
    uva1220--树的最大独立集+判重
    UVA12186--树型DP
    HDU4171--bfs+树
    远程调用
    高并发业务
    wireshark
    将java程序打包成exe文件
    将博客搬至CSDN
    Mysql分区
    MogileFS
  • 原文地址:https://www.cnblogs.com/zengfanjie/p/11851134.html
Copyright © 2011-2022 走看看