截屏2022-06-08 16.30.37.png截屏2022-06-18 22.42.21.png

  • 父子组件生命周期,和Vue一样

挂载

当组件实例被创建并插入 DOM 中时,其生命周期调用顺序如下:

  • **constructor()**
  • static getDerivedStateFromProps()
  • **render()**
  • **componentDidMount()**

    更新

    当组件的 props 或者 state 发生变化时会触发更新。组件更新的生命周期调用顺序如下

  • static getDerivedStateFromProps() // 返回值用来更新当前组件的states

  • shouldComponentUpdate()
  • **render()**
  • getSnapshotBeforeUpdate()
  • **componentDidUpdate()**

    卸载

    当组件从 DOM 中移除时会调用如下方法

  • **componentWillUnMount()**