js手札-reactjs生命週期

生命狀態：

Mounting：已插入真實DOM節點
Updating：正在從新渲染
Unmounting：已經移出真實節點

Mounting

Updating

大體順序：

---

兩個掛載：

componentWillMount()

一、服務端和客戶端都只調用一次
二、在初始化渲染以前調用

因此，若是這裏調用setState，則會在render中感知到state的變化。

componentDidMount()

一、僅在客戶端有效
二、初始化渲染以後當即調用一次

這時已經有成型的DOM樹了，因此能夠經過this.getDOMNode()來獲取DOM

四個更新

componentWillReciverPros(nextProps)

一、在接收到新的參數（props）時，會被執行
二、在render以前被調用
三、在初始化渲染的時候，不會被調用

若調用this.setState()並不會引發第二次渲染。

shouldComponentUpdate(nextProps, nextState)

一、在接收到新的 props或state時，調用
二、在render以前被調用
三、初始化渲染不調用

若返回false，則組件不會更新（即render()不會被執行），同時，componentWillUpdate和componentDidUpdate也不會被執行。

componentWillUpdate(nextProps, nextState)

一、在接收到新的 props或state前，馬上調用
二、初始化渲染不調用

不能使用this.setState

componentDidUpdate(prevProps, prevState)

一、在組件更新已經同步到DOM上以後調用
二、初始化渲染不調用

一個移除

componentWillUnmount

在組件將被移出的時候調用