聲明周期我們將它分成了三部分：
1. 初始化與掛載
執(zhí)行構(gòu)造函數(shù)->componentWillMount->render->componentDidMount
這個(gè)過(guò)程在組件的生命周期中只執(zhí)行一次菱蔬。等componentDidMount執(zhí)行完畢之后，組件就進(jìn)入了運(yùn)行狀態(tài)仅颇。
2. 運(yùn)行階段
當(dāng)props發(fā)生改變后剖膳，會(huì)先回調(diào)componentWillReceiveProps并傳入新的props。然后會(huì)執(zhí)行更新界面相關(guān)的一系列回調(diào)方法格侯。
當(dāng)state發(fā)生改變后鼻听，會(huì)執(zhí)行更新相關(guān)的回調(diào)方法。
更新相關(guān)的回掉方法:
1联四、shouldComponentUpdate 該函數(shù)會(huì)返回一個(gè)bool值用來(lái)決定是否需要更新界面撑碴。
2、componentWillUpdate 更新前會(huì)回調(diào)這個(gè)函數(shù)朝墩。
3醉拓、render再次執(zhí)行這個(gè)函數(shù)，這個(gè)函數(shù)返回子組件信息。
4亿卤、componentDidUpdate 等待更新完成之后回調(diào)
3. 卸載階段
當(dāng)組件將要被卸載時(shí)愤兵，回先回調(diào)componentWillUnmount函數(shù)。
生命周期對(duì)應(yīng)方法名 作用 調(diào)用次數(shù)
| 方法名 | 作用 | 調(diào)用次數(shù) |
|---|---|---|
| constructor | 構(gòu)造函數(shù)排吴，初始化需要的state | 1次 |
| componentWillMount | 控件渲染前觸發(fā) | 1次 |
| rander | 渲染控件的方法 | 多次 |
| componentDidMount | 控件渲染后觸發(fā) | 1次 |
| componentWillReceiveProps | 組件接收到新的props時(shí)被調(diào)用 | 多次 |
| shouldComponentUpdate | 當(dāng)組件接收到新的props和state時(shí)被調(diào)用 | 多次 |
| componentWillUpdate | props或者state改變秆乳，并且此前的shouldComponentUpdate方法返回為 true會(huì)調(diào)用該方法 | 多次 |
| componentDidUpdate | 組件重新渲染完成后會(huì)調(diào)用此方法 | 多次 |
| componentWillUnmount | 組件卸載和銷毀之前被調(diào)用 | 1次 |
生命周期示例圖
image.png
