Vue實例的生命週期

一、生命週期鉤子 = 生命週期函數 = 生命週期事件

 

二、創建期間的生命週期函數:

1、beforeCreate 生命週期函數:實例在內容中被創建出來,此時,data 和 methods 屬性 還沒有被初始化好!

2、created 生命週期事件:data 和 methods 屬性 已經創建 OK此時還沒有開始編譯模板

3、beforeMount 生命週期鉤子此時已完成了模板的編譯還沒有掛載到頁面中

4、mounted :此時,已將編譯好的模板,掛載到了頁面指定的容器中顯示。

 

三、運行期間的生命週期函數:

1、beforeUpdate 生命週期函數 :狀態更新之前執行次函數。此時 data 中的狀態值是最新的但是界面上顯示的數據還是舊的,因爲此時還沒有開始重新渲染 DOM 節點。

2、updated 生命週期鉤子:實力更新完畢之後調用該函數。此時 data 中的狀態值 和界面上顯示的數據,都已經完成了更新,界面已經被重新渲染好了。

 

四、銷燬期間的生命週期鉤子:

1、beforeDestroy:實例銷燬前使用;

2、destroyed:實例銷燬之後調用。

 

 

 

created :此時data和methods已經初始化完畢;

mounted:此時Vue實例已經新建完畢,靜靜地躺在內存中。