# 生命周期

## React < v16.3

![图：React < v16.3 生命周期图](https://1381653940-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LMDC17hlfiBPuoAp2bE%2F-LrtIWx3qes9mwETYMvP%2F-LrtIeUlIoPFy_I0288A%2Fimage.png?alt=media\&token=264ca7e2-f0ce-4784-945c-115d27fa5999)

* 红色是在 v17 版本后废弃的生命周期。
* 细字体的声明周期是不常用的，加粗是常用的。

## React > v16.3

React v16.3，引入了两个新的生命周期函数：

* **getDerivedStateFromProps**
* **getSnapshotBeforeUpdate**

{% hint style="info" %}
**Tips**：`getDerivedStateFromProps` 实际上就是用来取代以前的 `componentWillMount` 和 `componentWillReceiveProps`
{% endhint %}

随着 `getDerivedStateFromProps` 的推出，同时deprecate了一组生命周期API，包括：

* **componentWillReceiveProps**
* **componentWillMount**
* **componentWillUpdate**

新的生命周期图如下图所示：

![图：React > v16.3 生命周期图](https://1381653940-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LMDC17hlfiBPuoAp2bE%2F-LrtJGpHAjBfyHQHd22h%2F-LrtJLH1xEOitqfhneyD%2Fimage.png?alt=media\&token=3dc29301-a62f-44d4-b8fe-dccdf3bae18d)

* 细字体的声明周期是不常用的，加粗是常用的。