生命週期函式詳解

2021-10-21 19:59:12 字數 825 閱讀 8169

constructor(props)

render()

render 方法是 class 元件必須實現的方法

static getderivedstatefromprops(props, state)

該方法會在 render 方法之前呼叫,無論是掛載階段還是更新階段,它的存在只有乙個目的:讓元件在 props 變化時更新 state

componentdidmount()

在元件掛載後(render 的內容插入 dom 樹中)呼叫。通常在這個階段,我們可以:

shouldcomponentupdate(nextprops, nextstate)

發生在更新階段,getderivedstatefromprops 之後,render 之前,該函式會返回乙個布林值,決定了後續是否執行 render,首次渲染不會呼叫該函式

getsnapshotbeforeupdate(prevprops, prevstate)

該方法在 render() 之後,但是在輸出到 dom 之前執行,用來獲取渲染之前的快照。當我們想在當前一次更新前獲取上次的 dom 狀態,可以在這裡進行處理,該函式的返回值將作為引數傳遞給下個生命週期函式

componentdidupdate

該函式並不常用。

componentdidupdate()

該函式會在 dom 更新後立即呼叫,首次渲染不會呼叫該方法。我們可以在這個函式中對渲染後的 dom 進行操作

componentwillunmount()

錯誤處理

當渲染過程,生命週期,或子元件的建構函式中丟擲錯誤時,會呼叫如下方法

生命週期函式

另外說一下生命週期函式 virtual void onenter virtual void onentertransitiondidfinish virtual void onexit 這3個是遇到對應情況時呼叫的。在cpp檔案裡如果把它們示例了,你可以在開始時放 結束時關閉 等等。如果他下面的之類...

Vue之生命週期函式詳解

眾所周知。vue生命週期分成八個階段 此部落格搭配vue官方週期圖示食用效果更佳。vue例項已經建立,但是data,和methods中的資料和方法都未被初始化。就是說你可以在beforecreated 中獲取到this,this指的是當前的vue例項或者元件,但是this.data,this.met...

下生命週期函式

另外說一下生命週期函式 virtual void onenter virtual void onentertransitiondidfinish virtual void onexit 這3個是遇到對應情況時呼叫的。在cpp檔案裡如果把它們示例了,你可以在開始時放 結束時關閉 等等。如果他下面的之類...