React组件的生命周期

老版本: React<16.3

• 装配阶段(特点:一辈子只执行一次)
  • componentWillMount
  • render
  • componentDidMount
• 更新阶段:按需,根据props属性或state状态的改变，有选择性的执行0到多次
  • componentWillReceiveProps
  • shouldComponentUpdate
  • componentWillUpdate
  • render
  • componentDidUpdate
• 卸载阶段(一辈子只执行一次)
  • componentWillUnmount

image.png

新版本: React>=16.3
新版本的生命周期会用静态方法 getDerivedStateFromPorps来替代componentWillMount，componentWillReceiveProps，componentWillUpdate

image.png