Vue 生命週期的鉤子函式

2021-09-26 10:06:57 字數 1509 閱讀 2574

生命週期的鉤子函式(寫在方法的下面,一共有11個)

1.vue的整個生命週期的特定時刻,自動呼叫的函式

2.beforecreate 例項建立之前呼叫, 資料沒有掛載,不能訪問資料

vue例項初始化的時候就被執行(資料載入之前執行的乙個函式,拿不到data裡面的資料)

3.created 例項建立之後呼叫,能訪問、修改資料,單修改資料不會觸發updated函式 在這裡可以向伺服器請求資料,(也可以拿到父元件的陣列進行修改等操作,這一步驟是沒有操作到模板,資料和模板還沒有結合)

下一步就是開始找模板,找不到的話就把el接管的div作為模板,如果有模板就會渲染模板

4.beforemount 編譯模板已經完成(模板和資料都已經準備就緒了) 虛擬dom已經存在 還沒有進行進行渲染

也能修改資料,但是修改資料不會觸發update函式(元件不解除安裝,只能執行一次)

5.render 渲染是vue自動完成的。如果手動寫render函式,渲染的東西

就會把 vue自動渲染的東西覆蓋調

mounted 真實的dom元素已經存在, 可以獲取節、修改資料,而且修改資料會觸發update函式(頁面已經渲染,替換了之前的dom元素)

beforeupdate 資料更新之前觸發(資料更新:就是dom上的資料發生變化)

updated 資料修改後執行 修改資料要可能造成死迴圈(在這裡盡量不要修改資料)

beforedestroy 銷毀之前 要做一些清理工作,防止記憶體洩漏

activated keep-alive 啟用動態元件時呼叫

deactivated keep-alive 解除安裝動態元件時呼叫(已經銷毀的時候執行)

vue生命週期

1、什麼是vue生命週期?

答: vue 例項從建立到銷毀的過程,就是生命週期。也就是從開始建立、初始化資料、編譯模板、掛載dom→渲染、更新→渲染、解除安裝等一系列過程,我們稱這是 vue 的生命週期。

2、vue生命週期的作用是什麼?

答:它的生命週期中有多個事件鉤子,讓我們在控制整個vue例項的過程時更容易形成好的邏輯。

3、vue生命週期總共有幾個階段?

答:它可以總共分為8個階段:建立前/後, 載入前/後,更新前/後,銷毀前/銷毀後

4、第一次頁面載入會觸發哪幾個鉤子?

答:第一次頁面載入時會觸發 beforecreate, created, beforemount, mounted 這幾個鉤子

5、dom 渲染在 哪個週期中就已經完成?

答:dom 渲染在 mounted 中就已經完成了。

6、簡單描述每個週期具體適合哪些場景?

答:生命週期鉤子的一些使用方法: beforecreate : 可以在這加個loading事件,在載入例項時觸發 created : 初始化完成時的事件寫在這裡,如在這結束loading事件,非同步請求也適宜在這裡呼叫 mounted : 掛載元素,獲取到dom節點 updated : 如果對資料統一處理,在這裡寫上相應函式 beforedestroy : 可以做乙個確認停止事件的確認框 nexttick : 更新資料後立即操作dom

vue生命週期,鉤子函式

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

vue 生命週期(鉤子函式)

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

vue生命週期鉤子函式

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