react生命週期

當頁面被開啟，路由被啟用，將會觸發掛載

constructor建立乙個元件的解構，在裡面執行super(),建立元件私有資料 this.state={} ，constructor只會執行一次

render階段，建立乙個虛擬的dmo，在裡面建立html**，通過return返回建立的虛擬demo結構

子元件的render()函式會在父元件render()執行的時候被執行（這會導致一些效能問題，我們可以在子元件的componentshouldupdate函式中進行判斷，優化效能）

注意：不要在render中修改state,會導致死迴圈。

componentwillmount元件即將掛載，這個基本沒什麼用，即將被廢棄，不推薦使用

元件被掛載到頁面之前呼叫，整個生命週期中只會呼叫一次（元件更新時不會再呼叫）。

注意：在這裡可修改state，但是沒有必要，一開始為什麼不將state資料寫好呢

componentdidmount元件掛載完成，這個很有用，在這個函式裡面可以獲取頁面的元素標籤，可以進行ajax請求，準備更新頁面，只會被執行一次

建議：在這裡可以非同步請求資料。在這裡設定狀態會觸發重新渲染。但是不推薦在這裡使用setstate函式，它會觸發一次額外的渲染，而且是在瀏覽器重新整理螢幕之前執行，使用者看不到這個狀態。在這裡使用setstate函式會導致效能問題。

當元件接受的引數props被改變或者元件自身的私有資料發生改變，將會觸發更新

getderivedstatefromprops(nextprops,prevstate)

新的靜態getderivedstatefromprops生命週期在元件例項化以及接收新props(只要父元件重新渲染，那麼這個props不論值是否一樣都是乙個新的props)後呼叫。它可以返回乙個物件來更新state，或者返回null來表示新的props不需要任何state更新。

componentwillreceiveprops(nextprops)

注意：此生命週期在未來17版本中將被棄用

元件從父元件中接受了新的props(只要父元件重新渲染，那麼這個props不論值是否一樣都是乙個新的props)，並且元件已經存在時呼叫。（元件初始化時候不呼叫）。

注意：可以根據屬性的變化，通過呼叫this.setstate()來更新你的元件狀態，舊的屬性還是可以通過this.props來獲取,這裡呼叫更新狀態是安全的，並不會觸發額外的render呼叫

getsnapshotbeforeupdate()

新的getsnapshotbeforeupdate生命週期在更新之前被呼叫（例如，在dom被更新之前）。此生命週期的返回值將作為第三個引數傳遞給componentdidupdate。（這個生命週期不是經常需要的，但可以用於在恢復期間手動儲存滾動位置的情況。）

shouldcomponentupdate(nextprops,nextstate)

元件更新之前呼叫（元件接受新的props或者state）。函式會返回乙個布林值，true才會更新元件。

注意：最好判斷一下新舊兩個props/state是否相同，相同則返回false不要觸發更新。這樣就不用生成新的dom樹和舊的進行diff演算法對比，從而優化效能。（因為父元件render()呼叫會使得子元件render()也被執行，引起效能問題）

componentwillupdate(nextprops,nextstate)

元件即將更新。這個方法可以用來儲存更新前的props或者state，但即將被棄用，在接下來的版本可能不好使，盡量避免使用

元件更新之前（componentshouldupdate返回true）時呼叫，元件初始化時不呼叫

注意：在這裡可以更改state，nextstate.*** = ***,但是在這裡不能呼叫setstate函式，這會導致函式呼叫componentshouldupdate從而進入死迴圈。

render更新，自然需要前後對比，對發生改變的虛擬demo進行建立，更換。開發者一般利用不到更新這一次的render函式，但確實有這麼乙個過程

componentdidupdate組建更新完成這個時候可以去獲取新的元素標籤了

當頁面關閉觸發

componentwillunmount即將解除安裝元件儲存需要儲存的資料，清除掉定時器和不需要的監視，做一些善後的工作，提高**的優化性