3
学习React免不了对组件生命周期的学习,我们应该掌握最新生命周期,学以致用,以达到性能优化的目的。

The Component Lifecycle

React Version: 16.3

1 生命周期可视化

高清大图--欢迎转载

React最新生命周期:The Component Lifecycle Flowchart

2 简要总结:

  • 去掉了3个方法
  1. componentWillMount
  2. componentWillReceiveProps
  3. componentWillUpdate
  • 增加了2个方法
  1. static getDerivedStateFromProps(nextProps, prevState)
  2. getSnapshotBeforeUpdate(prevProps, prevState)
  • 更改了1个方法,增加了第3个参数
  1. componentDidUpdate(prevProps, prevState, snapshot)
  • 更改原因:

官网说是为了实现将来新版本的异步渲染In order to support async rendering

最后

如有兴趣深入了解的同学,可以到官网了解最新资讯。

官网文档: https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops

单通
135 声望3 粉丝

致力于成为一名优秀的Full Stack(可以独立解决web所有问题)的工程师