组件的生命周期可分为挂载、更新和卸载三个阶段，其中还包含有对错误的处理
挂载
当组件实例被创建并插入到DOM中，其生命周期调用顺序如下：
1
2
| constructor()
在react组件挂载之前，会调用它的构造函数，构造函数有两种用途：1、通过给this.state赋值来初始化内部的state 2、为事件处理函数绑定实例
|
1
2
| static getDrivedStateFromProps()
会在render()方法被调用之前被调用，并且载初始化挂载及后续更新时都会被调用。它返回一个对象来更新state，如果返回null则不更新任何内容
|
1
2
3
| render()
是class组件中唯一必须实现的方法
当它被调用的时候，会检查this.props和this.state的变化并返回react元素
|
1
2
| componentDidMount()
会在组件挂载后（插入DOM树中）立即调用，依赖DOM节点的初始化应该放在这里，比如说通过网络请求数据，另外对DOM节点的操作，添加订阅也放这里
|
更新
当组件的props和state发生改变时会出发更新。组件更新的生命周期调用顺序如下：
1
| static getDerivedStateFromProps()
|
1
2
| shouldCompnentUpdate()
可根据该方法的返回值来判断react组件的输出是否受当前state或props更改的影响，默认行为是state每次发生改变时组件都会重新渲染
|
1
| getSnapshotBeforeUpdate()
|
1
2
3
4
5
6
7
8
9
| componentDidUpdate()
//当组件更新后，可以在此处对Dom进行操作，如果对更新前前后的props进行了比较，也可以选择在这里进行网络请求（例如，当props未发生改变的时候，不会执行网络请求）
componentDidUpdate(prevProps){
if(this.props.userID !== prevProps.userID){
this.fetchData(this.props.userID)
}
}
//如果想要在这个函数里面调用setState（）,则也要将它放在条件语句里，要不然会导则死循环。
|
卸载
当组件从Dom中移除时会调用以下方法：
1
2
| componentWillUnmount()
会在组件卸载及销毁之前直接调用。可用于清除定时器、取消网络请求或清除在componentDidMount()中创建的订阅。
|
错误处理
渲染过程、生命周期，或子组件的构造函数中抛出错误时，会调用如下方法：
static getDrivedStateFromError()
componentDidCatch()