學習記錄 react生命週期

2021-10-11 21:30:13 字數 973 閱讀 7909

參考:

生命週期函式

框架中提前設定好的

在一些關鍵時刻會執行

生命週期函式的邏輯需要我們自己編寫

例項期

contructor

componentwillmount:初始化資料 (相當於vue裡的created) 過期

render(僅僅產生虛擬dom)

①render之後得到了乙份虛擬dom

②reactdom.render()只有這個方法將虛擬dom轉換成真實dom

componentdidmount:已經將虛擬dom轉換成真實dom (vue裡的mounted)

存在期

componentwillreceiveprops 過期

shouldcomponentupdate

(1) 可以自定義返回乙個布林值

(2) 決定我們元件是否更新

(3) 如果未定義該函式,預設返回就是true

(4) 提公升效能

componentwillupdate 元件將要被更新過期

render 元件正在更新

componentdidupdate元件已經更新完成

銷毀期

componentwillunmount:元件將要銷毀的時候執行 取消事件監聽

新增生命週期

React 生命週期 生命週期方法

生命週期 掛載 更新 解除安裝 元件被建立 執行初始化 並被掛載到dom中,完成元件的第一次渲染 constructor props getderivedstatefromprops props,state render componentdidmount 元件被建立時會首先呼叫元件的構造方法,接受...

react學習筆記 react生命週期

react v16.4 的生命週期 提前感謝aermin的筆記詳解react生命週期 包括react16版 讓我收益匪淺。我通常把react生命週期劃分為四個階段 元件初始化,元件掛載,元件更新,元件解除安裝。import react,from react class test extends co...

React學習 二 React生命週期

工作中發現在使用react元件時會出現先後順序的問題,也就是在乙個元件的整個生命週期中,通過使用者的互動來更新state或者props,重新渲染元件,更新頁面的ui。組成乙個簡單的 狀態機 1 constructor 構造方法 constructor是es6對類的預設方法,通過 new命令生成物件例...