react 生命週期

react生命週期大體分為三個週期: 掛載、渲染、解除安裝。

react生命週期圖

react 的宣告週期分為:

建立初始化

getdefaultprops初始化props

getinitialstate初始化state

掛載(17版本即將廢棄)componentwillmount掛載前

componentdismount掛載結束

更新(17版本即將廢棄)componentwillreceivepropsprops發生改變觸發

shouldcomponentupdate資料改變是否應該更新頁面

(17版本即將廢棄)componentwillupdate元件將要更新

componentdidupdate元件更新完畢

元件銷毀

componentwillunmount 解除安裝銷毀

constructor()中完成了react資料的初始化，它接受兩個引數：props和context，當想在函式內部使用這兩個引數時，需使用super()傳入這兩個引數

constructor()

}

一般使用的比較。

特點:

作用:

componentdidmount掛載結束

特點:+ dom節點已經生成

+ 可以做網路請求

+ 可以做初始化的操作

+ 資料的修改不能直接引起頁面的改變, 需要通過setstate修改

+ 資料的修改會觸發執行中的宣告週期

(v17即將廢棄)componentwillreceivepropsprops發生改變的時候觸發

作用:

shouldcomponentupdate資料的改變是否應該引起頁面的更新

引數:

特點:

shouldcomponentupdate()

解除安裝銷毀

componentwillunmount

React 生命週期 生命週期方法

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

react 生命週期

首次例項化 例項化完成後的更新 元件已存在時的狀態改變 生命週期共提供了10個不同的api。1.getdefaultprops 作用於元件類，只呼叫一次，返回物件用於設定預設的props，對於引用值，會在例項中共享。2.getinitialstate 作用於元件的例項，在例項建立時呼叫一次，用於初始...

react生命週期

盜圖一張 第一次進入頁面列印結果 1 parent constructor 2 parent conponentwillmount 3 parent render 4 initial render constructor 5 componentwillmount 6 render 7 compone...