vue之生命週期鉤子函式之運用

2022-07-20 08:36:10 字數 611 閱讀 9917

一.什麼是生命週期鉤子函式:

每個 vue 例項在被建立時都要經過一系列的初始化過程——例如,需要設定資料監聽、編譯模板、將例項掛載到 dom 並在資料變化時更新 dom 等。同時在這個過程中也會執行一些叫做生命週期鉤子的函式,這給了使用者在不同階段新增自己的**的機會。

vue的8中生命週期函式:

1.beforecreate:該函式在例項物件剛被建立,還沒有繫結屬性時觸發執行。

2.created:該函式在例項物件完成建立和屬性繫結,但是dom還未生成($el屬性還不存在)時觸發執行。

3.beforemount:該函式在元件掛載之前觸發執行。

4.mounted:該函式在元件掛載完成之後觸發執行。

5.beforeupdate:該函式在元件資料更新之前觸發執行。

6.updated:該函式在元件資料更新完畢之後觸發執行。

7.beforedestroy:該函式在例項物件銷毀之前觸發執行。

8.destroyed:該函式在例項物件完成銷毀之後觸發執行。

具體應用

vue生命週期,鉤子函式

一 vue生命週期簡介 咱們從上圖可以很明顯的看出現在vue2.0都包括了哪些生命週期的函式了,總結一下,對官方文件的那張圖簡化一下,就得到了這張圖。二 生命週期 對於執行順序和什麼時候執行,看上面圖基本有個了解了。下面我們將結合 去看看鉤子函式的執行。鉤子函式 1.create 和 mounted...

vue 生命週期(鉤子函式)

new vue 例項物件,下一步進入beforcreate 狀態 當使用new vue 建立物件之前,執行的事件 這裡可以做載入動畫 下一步,進入created 然後,他會檢測是否有el屬性,如果有在檢測template屬性型別,是一段渲染的函式還是一段html 然後就進入了beforemount狀...

vue生命週期鉤子函式

什麼是生命週期?vue中的生命週期指的是 元件 從建立到銷毀乙個過程,在這個過程中,我們在每乙個特定的階段會觸發一些方法 這些方法具備一些功能 我們給這些方法起了個名字叫做 生命週期鉤子函式 元件鉤子 為什麼要學習生命週期?因為我們想在生命週期鉤子中實現專案功能,那麼我們必須知道每乙個鉤子函式的具體...