React v16.3新生命周期、性能优化及注意事项

React Version: 16.3版本对组件的生命周期函数进行了一些修改,在每个react组件中都有以下几个生命周期方法
我们应该掌握最新生命周期,学以致用,以达到性能优化的目的。

1.生命周期的可视化,一张图看懂最新版React生命周期的特性,渲染动作。

React v16.3新生命周期、性能优化及注意事项

2.相比之前React版本,总结
  • 去掉了3个方法:
  1. componentWillMount
  2. componentWillReceiveProps
  3. componentWillUpdate
  • 新增了2个方法
  1. static getDerivedStateFromProps(nextProps, prevState)
  2. getSnapshotBeforeUpdate(prevProps, prevState)
  • 更改了1个方法,增加了第3个参数
  1. componentDidUpdate(prevProps, prevState, snapshot)