vue對鉤子的理解

2021-08-28 08:07:58 字數 581 閱讀 3657

生命週期:vue頁面生成的過程當中的不同階段 

生命週期鉤子:就是可以讓你在頁面生成的不同階段執行動作的api,作用就是只要頁面到了這個階段就會觸發這個對應鉤子裡的js 

總共分為8個階段建立前/後,載入前/後,更新前/後,銷毀前/後。   

建立前/後:在beforecreated階段,vue例項的掛載元素$el和資料物件data都為undefined,還未初始化。在created階段,vue例項的資料物件data有了,$el還沒有。   

載入前/後:在beforemount階段,vue例項的$el和data都初始化了,但還是掛載之前為虛擬的dom節點,data.message還未替換。在mounted階段,vue例項掛載完成,data.message成功渲染。   

更新前/後:當data變化時,會觸發beforeupdate和updated方法。   

銷毀前/後:在執行destroy方法後,對data的改變不會再觸發週期函式,說明此時vue例項已經解除了事件監聽以及和dom的繫結,但是dom結構依然存在 

Vue生命週期鉤子的理解

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

vue生命週期 鉤子理解

在vue文件中,對生命週期部分有如下檢視 建立vue例項 init events lifecycle 開始初始化 beforecreate 元件剛被建立,組建屬性計算之前,如data屬性等 init injections reactivity 通過依賴注入匯入依賴項 created 元件例項建立完成...

理解vue生命週期鉤子

先上一副官網的生命週期圖,稍微補充了點說明。在不同的生命週期函式中執行 const vm newvue data watch immediate true,computed 生命週期 beforecreate created beforemount mounted beforeupdate upda...