組件生命周期,組件本質(zhì)上是狀態(tài)機
組件把狀態(tài)和結(jié)果一一對應(yīng)起來
組件中有state狀態(tài) 和 props屬性间影,屬性是有父組件傳遞給子組件的注竿,狀態(tài)是子組件內(nèi)部維護的數(shù)據(jù),當(dāng)狀態(tài)發(fā)生變化時組件也會相對應(yīng)的更新魂贬,我們可以理解成一個state對應(yīng)一個render結(jié)果巩割。
狀態(tài)發(fā)生轉(zhuǎn)換時會觸發(fā)不同鉤子函數(shù),從而讓開發(fā)者有機會做出響應(yīng)付燥,狀態(tài)轉(zhuǎn)換是有react內(nèi)部維護的宣谈,我們不能參與其中,但是給我們開發(fā)者提供了鉤子函數(shù)键科,我們可以自己編寫鉤子函數(shù)闻丑,這樣react轉(zhuǎn)換時就調(diào)用了這些鉤子函數(shù)
組件初始化階段:
getDefaultProps? ? 獲取實例默認(rèn)屬性(組件在第一個實例化時調(diào)用也就說從第2次實例只會調(diào)用getInitialState)
getInitialState ? ? ?獲取實例初始狀態(tài)
componentWillMount ?組件即將被裝載渲染到頁面時觸發(fā)該函數(shù)(意思是組件還沒有被渲染到頁面)
render ? 組件在render生成虛擬DOM節(jié)點jsx,最后由react渲染成真正節(jié)點放在頁面中
componentDidMount? ? 組件裝載之后調(diào)用勋颖,已經(jīng)渲染完成到頁面中
運行中階段:
componentWillReceiveProps ?組件將要接收到屬性時調(diào)用(接收到屬性之前觸發(fā))嗦嗡,如果組件的屬性發(fā)生變化,比如說父組件改變了子組件的屬性饭玲,那么組件就需要更新
shouldComponentUpdate ??當(dāng)組件接收到新屬性或者新狀態(tài)時候就會觸發(fā)這個函數(shù)侥祭,有時候我改變屬性或者狀態(tài)時候不需要更新組件render就可以在這一不return false告訴react 不需要render后面操作(從而可以提供性能)
componentWillUpdate ? 在render觸發(fā)之前調(diào)用,它是在組件更新操作觸發(fā)茄厘,而不是初始化階段
render ?和初始化階段render是一樣的
componentDidUpdate ? ? 它是在render結(jié)束之后真正DOM渲染完成后調(diào)用
銷毀階段觸發(fā)的函數(shù)
componentWillUnmount ? ?會在銷毀操作執(zhí)行之前調(diào)用矮冬,給開發(fā)者最后的機會來做一下清理操作