掛載階段(Mount:插入真實(shí)DOM)
image.png
第一次初始化顯示: ReactDOM.render(<Xxx/>, containDom)
constructor()
componentWillMount() : 將要掛載
render() : 第一次渲染顯示
componentDidMount() : 已掛載顯示
-
componentWillMount
- 在組件即將被掛載到頁(yè)面的時(shí)候自動(dòng)執(zhí)行想虎。
-
componentDidMount
- 組件被已經(jīng)掛載到頁(yè)面之后自動(dòng)執(zhí)行。(初始顯示)該函數(shù)代表組件實(shí)例化完成,這個(gè)時(shí)候非常適合執(zhí)行1. 異步操作(Ajax) 2. 事件訂閱
更新階段(Update階段:被重新渲染)
組件鉤子函數(shù)react之更新階段.png
==componentWillReceiveProps==
一個(gè)組件要從父組件接收參數(shù)
如果這個(gè)組件第一次存在于父組件中,不會(huì)執(zhí)行立润。
如果這個(gè)組件之前已經(jīng)存在于父組件中,才會(huì)執(zhí)行空镜。
==shouldComponentUpdate==
當(dāng)函數(shù)返回 true 的時(shí)候,周期函數(shù)會(huì)繼續(xù)往下執(zhí)行 render 渲染捌朴;當(dāng)函數(shù)返回 false吴攒,周期函數(shù)則會(huì)中止于此,并停止下面的渲染砂蔽。如果不設(shè)置洼怔,這個(gè)函數(shù)會(huì)默認(rèn)返回 true。
==componentWillUpdate==
組件被更新之前左驾,它會(huì)自動(dòng)執(zhí)行镣隶,但是前提是shouldComponentUpdate返回true它才執(zhí)行
==componentDidUpdate==
-
componentDidUpdate
函數(shù)會(huì)在更新發(fā)生后立即被調(diào)用。