React元件生命週期

2021-07-14 13:48:29 字數 548 閱讀 1229

元件的所有狀態結合起來就成了元件的生命週期。即:初始化階段->執行中階段->銷毀階段。 

不同生命週期內可以自定義的函式

初始化階段:

①getdefaultprops:獲取預設屬性,只呼叫一次,是在createclass之後呼叫的。例項之間共享引用②getinitialstate:初始化每個例項的特有初始化狀態③componentwillmount:mout就是裝載的意思,這個方法的意思就是說元件即將被裝載到頁面中,也是render之前最後一次修改狀態的機會④render:元件在render函式生成虛擬節點,最後由react將虛擬節點變成真正的節點渲染到頁面上。只能訪問this.props和this.state,只有乙個頂層元件,最好不要修改狀態和dom輸出。⑤componentdidmount:元件被裝載後才會被呼叫,也就是說呼叫這個方法的時候,元件已經被渲染到了頁面上,這個時候可以修改dom這五個函式的執行順序就是從上到下的。需要注意的是getdefaultprops只會在元件的第乙個例項被初始化的時候被呼叫,也就是說第二個例項之後都是從getinitialstate開始呼叫。同乙個元件的所有例項的預設屬性都是一樣的。

React元件生命週期

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

React 元件生命週期

在本章節中我們將討論 react 元件的生命週期。元件的生命週期可分成三個狀態 生命週期的方法有 這些方法的詳細說明,可以參考官方文件。以下例項在 hello 元件載入以後,通過 componentdidmount 方法設定乙個定時器,每隔100毫秒重新設定元件的透明度,並重新渲染 varhello...

React元件生命週期

元件的生命週期可分成三個狀態 mounted update unmounted mounted react components被render解析生成對應的dom節點,並被插入瀏覽器的dom結構的乙個過程 update 乙個mounted的react components被重新render的過程 這...