vue生命週期總結(個人理解)

2021-10-09 14:22:23 字數 748 閱讀 6053

附上官網生命週期圖:

beforecreate:開始建立階段,這個階段主要做的事是,初始化vue例項,此時元件的物件還未建立,el 和 data 並未初始化,因此無法訪問methods, data等上的方法和資料。

created:vue例項建立之後呼叫,資料觀察,屬性和方法的運算,完成了data的初始化,但el還沒有初始化,掛載階段還沒有開始,可以正常呼叫methods方法,這個時候可以進行一些獲取資料的請求。

beforemount:掛載之前被呼叫,此時,render函式首次呼叫(虛擬dom的建立),vue例項完成了data的資料和模板生成html,完成了data和el的初始化,但還沒有掛載到html頁面上。

mounted:掛載完成呼叫,此時頁面已經掛載到html上面,這個時候能夠進行獲取dom的屬性了。

beforeupdate: 資料更新之前呼叫,實時監測資料的變化,但會在dom更新之前呼叫,在這裡可以補充進一步更新狀態。

updated:呼叫時,dom和資料已經是最新的,此時可以獲取最新的dom的屬性,但不要這個階段在進行運算元據改變狀態,可能會導致事件不斷迴圈。

beforedestroy:元件銷毀之前,此時仍然可以呼叫vue例項(this仍然可以呼叫),一般用來對當前元件進行重置操作,清除定時器和監聽dom的事件。

destroyed:元件銷毀後,所有監聽事件都會被移除,所有子例項都會銷毀。

vue生命週期理解總結

由於近期面試老是會問到生命週期,以及父子元件渲染和銷毀的順序問題,所以空閒時間決定自己用 測試一下,加深自己對這個的理解。希望對你們也有所幫助 廢話不多說,直接上 an highlighted block data methods beforecreate created beforemount m...

個人對於Vue生命週期的理解

生命週期 元件從建立到銷毀的一系列過程叫做元件的宣告週期。vue在整個生命週期裡面提供了一些函式,可以在內部實現一些業務邏輯,並且這些函式會在一些特定的場合下去執行。在生命週期的某乙個時刻進行觸發 生命鉤子函式 vue在整個生命週期裡面提供了一些函式,可以在內部實現一些業務邏輯,並且這些函式會在一些...

vue生命週期理解

關於vue面試,最常問到的就是vue的生命週期,也看過很多關於如何回答過這個問題的解答,自己也有所總結,就簡單寫寫自己的看法。首先我們先來到vue的官網看看他是如何解釋的vue官網對生命週期描述 主要就是體現在這個圖上 可以看出生命週期中有8個主要的鉤子函式,分別是 activated與deacti...