誤區以為父組件render一次,子組件會重新初始化


初學react的時候我有一個誤區,以為父組件render的一次,會將子組件先卸載,再將子組件重新初始化,事實證明不是。

這是對react生命周期函數不太清楚。

父子組件都初始化后,父組件再render一次,子組件實際上進行的是聲明周期函數中的updation更新過程。

其實也很好理解這個生命周期函數,父組件執行更新過程一次,理所當然,子組件也執行一次,要不然你父組件給我的數據變了呢,我怎么知道,所以我也更新一下下。

那什么時候子組件會重新初始化呢,例如如下代碼:你用父組件來控制子組件的顯示和隱藏,將其隱藏的這種寫法,就是將子組件給卸載了,再次顯示,就會重新初始化。

當修改isShow為false的時候,子組件就直接進入卸載過程,執行componentWillUnmount函數后,就從dom中移除了。

{this.state.isShow && <SubComponent></SubComponent>}

再將isShow為true的時候, 此時子組件才是又初始化了一次,開始新的生命周期,進入初始化過程,接着是掛載過程。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM