vue例項從建立到銷毀的過程,就是生命週期。從開始建立,初始化資料,編譯模板,掛載dom→渲染、更新→渲染、銷毀等一系列過程,稱之為 vue 的生命週期。
在生命週期中被自動執行的函式就叫:鉤子函式/生命週期鉤子
生命週期鉤子函式的用途
在生命週期階段會被自動呼叫,為我們開發者提供了乙個自己執行的邏輯的機會
在vue生命週期中共有八個鉤子:
var vw=
newvue(,
beforecreate()
,created()
,beforemount()
,mounted()
,beforeupdate()
,updated()
,beforedestroy()
,destroyed()
})
列印結果如下
我們可以看到乙個vue例項在建立過程中呼叫的幾個生命週期鉤子。
1.beforecreate鉤子(例項建立開始)
例項的掛載元素el和資料物件data都為undefined,還未初始化,$el裡面沒有東西
2.created鉤子(例項建立結束)
資料和檢視已經繫結 data的資料改變了那麼檢視也會隨之改變,$el裡面還沒東西
3.beforemounted(載入前)
$el和data都初始化了,但是在掛載之前為虛擬dom節點,}只是佔位的
4.mounted(載入後)
vue例項掛載完成,data資料成功渲染,$el有內容
當我們通過控制台輸入vw.text=「資料修改」,修改data的資料時,會觸發以下這兩個鉤子
5.beforeupadte(資料準備更新)
當data的資料準備發生改變時,會觸發這個鉤子
6.updated(資料更新完畢)
當data的資料更行完成後,會觸發這個鉤子
7.beforedestroy(例項銷毀前)
例項銷毀之前呼叫,例項還是可以正常使用的
8.destroyed(例項銷毀後)
例項銷毀之後被呼叫 vue例項會把所有的內容解除繫結
通過呼叫vue例項的$destory()方法可以銷毀vue例項
整理了幾個vue生命週期面試題分享給大家
什麼是vue生命週期?
答: vue 例項從建立到銷毀的過程,就是生命週期。從開始建立、初始化資料、編譯模板、掛載dom→渲染、更新→渲染、銷毀等一系列過程,稱之為 vue 的生命週期。
vue生命週期的作用是什麼?
答:它的生命週期中有多個事件鉤子,讓我們在控制整個vue例項的過程時更容易形成好的邏輯。
vue生命週期總共有幾個階段?
答:它可以總共分為8個階段:建立前/後、載入前/後、更新前/後、銷毀前/銷毀後。
第一次頁面載入會觸發哪幾個鉤子?
答:會觸發下面這幾個beforecreate、created、beforemount、mounted 。
dom 渲染在哪個週期中就已經完成?
答:dom 渲染在 mounted 中就已經完成了
本文是純屬個人對vue的生命週期的理解,有什麼不對的地方還請各位大佬多多指點~
Vue 例項的生命週期
在vue中,每個例項都有自己的乙個完整的生命週期,包括開始建立 初始化資料 編譯模板 將例項掛載到dom 渲染 更新 渲染 解除安裝等一系列過程。同時在這個過程中也會執行一些叫做生命週期鉤子的函式,這樣我們就可以在例項生命週期的不同階段做一些需要做的事情。這裡可能會有個小疑惑,怎麼突然又說是vue例...
vue例項的生命週期
是一套用於構建使用者介面的漸進式框架。與其他框架不同的是,vue被設計為可以自底向上的逐層應用。vue 的核心庫只關注檢視層,不僅易於上手,還便於與第三方庫或既有專案整合。另一方面,當與現代化的工具鏈以及各種支援類庫結合使用時,vue 也完全能夠為複雜的單頁應用提供驅動。宣告式渲染 vue.js的核...
VUE 例項的生命週期
從vue例項建立 執行 到銷毀期間,總是伴隨著各種各樣的事件,這些事件,統稱為生命週期!vue把整個生命週期劃分為 建立 更新 掛載 銷毀 等階段其實就是生命週期事件的別名 var vm newvue methods beforecreate script 結果 我們可以看到 data 和el 還是...