欢迎来到码农权的博客 MaNongGeGe|

React类组件的生命周期

  • 初始化阶段的生命周期只会执行一次钩子函数,运行中的阶段会随着状态的改变或父组件变更了属性而执行钩子函数,销毁阶段会随着组件在DOM数上被移除而触发的钩子。
  • 具体看文件中的代码:https://gitee.com/manongquan02/react_test.git

新的生命周期 getDerivedStateFromProps与getSnapshotBeforeUpdate

getDerivedStateFromProps

  • getDerivedStateFromProps 特点: 替代了 componentWillMount(初始化) 和 componentWillUpdate(运行中) 更安全
  • getDerivedStateFromProps 在父组件传递属性变动则会影响子组件,子组件在渲染新DOM之前会触发getDerivedStateFromProps,getDerivedStateFromProps有两个参数,1.newProps 在渲染之前拿到最新的属性 2.newState 在渲染之前拿到最新的状态
  • getDerivedStateFromProps的返回值为一个对象,与旧的state对象进行合并

getSnapshotBeforeUpdate

  • getSnapshotBeforeUpdate的特点: 取代了 componentWillUpdate(运行中) 配合 componentDidUpdate 使用
  • componentDidUpdate的参数 1. oldProps 上一次的props, 2. oldState 上一次的状态 3. getSnapshotBeforeUpdate 在更新之前返回的值
  • getSnapshotBeforeUpdate 和 componentWillUpdate 的区别,执行顺序上的区别:componentWillUpdate的执行顺序是 componentWillUpdate -> render => componentDidUpdate 而 getSnapshotBeforeUpdate的执行顺序是 render => getSnapshotBeforeUpdate => componentDidUpdate 从此看出 新的生命周期(更新之前的钩子)调整了顺序 让更新之前的钩子和更新之后的钩子越来越近了。
  • getSnapshotBeforeUpdate的返回值不能为undefined

本文作者:HuangBingQuan

本文链接:https://www.cnblogs.com/bingquan1/p/16930986.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   HuangBingQuan  阅读(84)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起
  1. 1 不将就 码农权
  2. 2 Bleeding Love 码农权
  3. 3 想你念你 码农权
Bleeding Love - 码农权
00:00 / 00:00
An audio error has occurred, player will skip forward in 2 seconds.

Not available