react生命週期

上圖具體解釋

constructor

1，用於初始化內部狀態，不多使用

2，惟一能夠直接修改state的地方

getDerivedstateFromProps

若是state須要從props得到，通常來講均可以經過props動態計算得到他，而不須要單獨存儲這個狀態，一旦單獨存儲就要維護二者的一致性，這樣就會正價複雜性。

1，當state須要從props初始化時使用

2，儘可能不要使用：維護二者狀態一致性會增長複雜度

3，每次reder都會調用

4，典型場景：表單控件獲取默認值

componentDidMOunt

1，ui渲染完成後調用

2，只執行一次

3，典型場景：獲取外部資源

componentWillUnmount

1,組件移除時被調用

2，典型場景：資源釋放

getSnapshotBeforeUpdate

1，在頁面render以前調用，state已更新

2，典型場景：獲取render以前的dom狀態

componentDidUpdate

1,每次ui更新時被調用

2，典型場景：頁面須要根據props變化從新獲取數據

shouldComponentUpdate

1，決定virtual Dom是否要重繪

2，通常能夠由PureComponent自動實現

3，典型場景：性能優化