vue生命週期鉤子

生命週期：vue 例項從開始建立、初始化資料、編譯模板、掛載dom→渲染、更新→渲染、解除安裝等一系列過程，我們稱這是 vue 的生命週期，各個階段有相對應的事件鉤子。

函式元件狀態

最好的用法

beforecreate

例項初始化之後，this指向建立的例項，不能訪問到data、computed、watch、methods上的方法和資料

常用於初始化非響應式變數

created

例項建立完成，可訪問data、computed、watch、methods上的方法和資料，未掛載到dom，不能訪問到$el屬性，$ref屬性內容為空陣列

常用於簡單的ajax請求，頁面的初始化

beforemount

在掛載開始之前被呼叫，beforemount之前，會找到對應的template，並編譯成render函式

-mounted

例項掛載到dom上，此時可以通過dom api獲取到dom節點，$ref屬性可以訪問

常用於獲取vnode資訊和操作，ajax請求

beforeupdate

響應式資料更新時呼叫，發生在虛擬dom打補丁之前

適合在更新之前訪問現有的dom，比如手動移除已新增的事件***

updated

虛擬 dom 重新渲染和打補丁之後呼叫，元件dom已經更新，可執行依賴於dom的操作

避免在這個鉤子函式中運算元據，可能陷入死迴圈

beforedestroy

例項銷毀之前呼叫。這一步，例項仍然完全可用，this仍能獲取到例項

常用於銷毀定時器、解綁全域性事件、銷毀外掛程式物件等操作

estroyed

例項銷毀後呼叫，呼叫後，vue 例項指示的所有東西都會解繫結，所有的事件***會被移除，所有的子例項也會被銷毀

–vue 生命週期深入

vue生命週期鉤子

el 表示dom元素，data 表示資料 deforecreated el和data並未初始化 created 完成了data資料的初始化，el沒有 beforemount 完成了el和data初始化 mounted 完成掛載 el和data都初始化完成，並且掛載在頁面上了 注意 以下勾子只能在 k...

Vue 生命週期鉤子

從vue例項建立，執行，到銷毀期間，總是伴隨著各種各樣的事件，這些事件，稱為生命週期。建立 beforecreate 例項剛剛在記憶體中被建立出來，但data和methods還沒有進行初始化。created 例項已經在記憶體中建立，data和methods還沒有建立 beforemount 完成模板...

Vue 生命週期鉤子

生命週期函式就是vue例項在某乙個時間點自動執行的函式 伺服器端渲染期間生命週期被呼叫總共有8個函式 1.初始化事件和生命週期 beforecreate function 5.資料發生改變還沒重新渲染之前 beforeupdate function console.log beforeupdate ...