react 生命周期执行

React组件的生命周期可以分为三个阶段:

1. 挂载阶段(Mounting Phase):
- constructor: 初始化state和绑定事件处理函数。
- static getDerivedStateFromProps: 根据props更新state。
- render: 渲染组件的UI。
- componentDidMount: 组件已经被插入到DOM中后调用，可以进行异步操作、订阅事件等。

2. 更新阶段(Updating Phase):
- static getDerivedStateFromProps: 根据props更新state。
- shouldComponentUpdate: 控制组件是否重新渲染，默认返回true。
- render: 渲染组件的UI。
- getSnapshotBeforeUpdate: 在最终渲染结果被提交到DOM之前获取当前DOM状态的快照。
- componentDidUpdate: 组件更新后调用，可以进行DOM操作、网络请求等。

3. 卸载阶段(Unmounting Phase):
- componentWillUnmount: 组件从DOM中移除之前调用，可以进行清理操作。

此外，还有一些在特定情况下会被调用的生命周期方法，例如:
- static getDerivedStateFromError: 在子组件抛出错误时调用，返回一个新的state以更新UI。
- componentDidCatch: 在子组件抛出错误后调用，可以记录错误信息。

需要注意的是，React 16.3版本之后，一些生命周期方法已被标记为过时或不推荐使用，如componentWillMount、componentWillReceiveProps、componentWillUpdate等。推荐使用新的生命周期方法和React钩子函数来替代。