React 16之后有三個生命周期被廢棄(但並未刪除)
- componentWillMount
- componentWillReceiveProps
- componentWillUpdate
官方計划在17版本完全刪除這三個函數，只保留UNSAVE_前綴的三個函數，目的是為了向下兼容，但是對於開發者而言應該盡量避免使用他們，而是使用新增的生命周期函數替代它們。
目前React 16.8 +的生命周期分為三個階段,分別是掛載階段、更新階段、卸載階段。
掛載階段:
- constructor: 構造函數，最先被執行,我們通常在構造函數里初始化state對象或者給自定義方法綁定this
- getDerivedStateFromProps: static getDerivedStateFromProps(nextProps, prevState),這是個靜態方法,當我們接收到新的屬性想去修改我們state，可以使用getDerivedStateFromProps
- render: render函數是純函數，只返回需要渲染的東西，不應該包含其它的業務邏輯,可以返回原生的DOM、React組件、Fragment、Portals、字符串和數字、Boolean和null等內容
- componentDidMount: 組件裝載之后調用，此時我們可以獲取到DOM節點並操作，比如對canvas，svg的操作，服務器請求，訂閱都可以寫在這個里面，但是記得在componentWillUnmount中取消訂閱
更新階段:
- getDerivedStateFromProps: 此方法在更新個掛載階段都可能會調用
- shouldComponentUpdate: shouldComponentUpdate(nextProps, nextState),有兩個參數nextProps和nextState，表示新的屬性和變化之后的state，返回一個布爾值，true表示會觸發重新渲染，false表示不會觸發重新渲染，默認返回true,我們通常利用此生命周期來優化React程序性能
- render: 更新階段也會觸發此生命周期
- getSnapshotBeforeUpdate: getSnapshotBeforeUpdate(prevProps, prevState),這個方法在render之后，componentDidUpdate之前調用，有兩個參數prevProps和prevState，表示之前的屬性和之前的state，這個函數有一個返回值，會作為第三個參數傳給componentDidUpdate，如果你不想要返回值，可以返回null，此生命周期必須與componentDidUpdate搭配使用
- componentDidUpdate: componentDidUpdate(prevProps, prevState, snapshot),該方法在getSnapshotBeforeUpdate方法之后被調用，有三個參數prevProps，prevState，snapshot，表示之前的props，之前的state，和snapshot。第三個參數是getSnapshotBeforeUpdate返回的,如果觸發某些回調函數時需要用到 DOM 元素的狀態，則將對比或計算的過程遷移至 getSnapshotBeforeUpdate，然后在 componentDidUpdate 中統一觸發回調或更新狀態。
卸載階段:
- componentWillUnmount: 會在組件卸載及銷毀之前直接調用。在此方法中執行必要的清理操作，例如，清除定時器，取消網絡請求或清除在
componentDidMount()中創建的訂閱，清理無效的DOM元素等垃圾清理工作。
異常處理：
- static getDerivedStateFromError: 此生命周期會在渲染階段后代組件拋出錯誤后被調用。 它將拋出的錯誤作為參數，並返回一個值以更新 state。
- componentDidCatch：此生命周期在后代組件拋出錯誤后被調用。 它接收兩個參數：1. error —— 拋出的錯誤。2. info —— 帶有 componentStack key 的對象，其中包含有關組件引發錯誤的棧信息。componentDidCatch 會在“提交”階段被調用，因此允許執行副作用。 它應該用於記錄錯誤之類的情況。
參考：React 官方文檔