React 生命周期(精简版)

React严格定义了组件的生命周期会经历如下三个过程:

  • 装载过程(Mount),组件第一次在DOM树渲染的过程。
  • 更新过程(Update),当组件被重新渲染的过程。
  • 卸载过程(Unmount),当组件从DOM树中删除的过程。
    执行这3个过程的调用函数就是声明周期函数。

componentWillMount(): 组件挂载前触发的函数

  • 可以获取this数据,但是不能获取dom
  • 修改数据 不会触发运行中的生命周期

componentDidMount(): 挂载完成时触发的函数

  • 有dom 有数据 可以做网络请求及初始化操作
  • 数据修改不能直接引起页面改变 需要通过setState来改变数据
  • 数据修改会触发生命周期

shouldcCmponentUpdate(): 是否要更新数据时触发的函数

  • 该生命周期控制数据修改是否需要更新界面通过该生命周期减少无关页面更新
  • 返回true则更新,返回 false 则不更新
  • 参数props和state将要更新数据
  • this里的props和state 是还没更新的数据

componentWillUpdate(): 将要更新数据时触发的函数

  • 页面更新之前触发
  • 数据dom元素都是更新之前 也是在render前

componentDidUpdate(): 更新完成时触发的函数

  • 在更新操作结束后触发
  • 数据和dom都是修改之后的

conponentWillReceiveProps(): 父组件内改变了props传值时触发的函数

  • 监听props发生改变
  • 参数里是更新之后的数据
  • this里是更新之前的数据

componentWillUmmount 销毁时触发

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值