Vue.js入門筆記 實例的生命周期

• 2019 年 12 月 24 日
• 筆記

什麼是生命周期：從Vue實例創建、運行、到銷毀的期間，總是幫着各種各樣的事件，這些事件統稱為生命周期。

生命周期鉤子：生命周期時間的別名；

生命周期鉤子 = 生命周期函數 = 生命周期事件

生命周期函數分類

創建期間的生命周期函數

• beforeCreate：實例剛在內存中被創建出來，此時，還沒有初始化好 data 和 methods 屬性；
• created：實例已經在內存中創建OK，此時 data 和 methods 已經創建OK，此時還沒有開始編譯模板；
• beforeMount：此時已經完成了模板編譯，但是還沒有掛載到頁面中；
• mounted：此時，已經將編譯好的模板，掛載到了頁面指定的容器中顯示。

運行期間的生命周期函數

• beforeUpdate：狀態更新之前執行的函數，此時data中的狀態值是最新的，但是界面上顯示的數據還是舊的，因為此時還沒有開始重新渲染DOM節點；
• updated：實例更新完畢之後調用此函數，此時data中的狀態值和界面上顯示的數據，都已經完成了更新，界面已經被重新渲染好了。

銷毀期間的生命周期函數

• beforeDestroy：實例銷毀之前調用。在這一步，是你仍然完全可用；
• destoryed：Vue 實例銷毀後調用。調用後，Vue實例指示的所有東西都會解綁定，所有的事件監聽器會被移除，所有的子實例也會被註銷。

vue生命周期圖片

本文鏈接：https://www.debuginn.cn/3952.html

本文採用CC BY-NC-SA 3.0 Unported協議進行許可，轉載請保留此文章鏈接