1. 程式人生 > >初步認識vue-vue的生命週期

初步認識vue-vue的生命週期

vue的鉤子函式:

建立之前       beforeCreate() 

建立成功       created()

掛鉤之前       beforeMount()

掛鉤成功       mounted()

更新之前       beforeUpdate()

更新之後      updated()

消亡之前      beforeDestroy()

消亡              destroyed()

 

vue的生命週期:一個事物從出生到消亡的過程

先建立new Vue(),建立鉤子函式和常用的屬性,然後初始化事件和生命週期的一些鉤子函式,呼叫beforeCreate,初始化一些常用的依賴和響應式事件,這時例項物件建立完成,然後判斷是否有el元素,如果有這個選項就往下執行,到判斷是否有template選項,如果沒有這個選項,需要手動掛載el元素,繫結這個元素,繫結完之後進入判斷是否有template選項,如果沒有就渲染outHTML,然後進入掛載;如果有template則進入渲染template函式,渲染完成之後建立vm.$el元素來替換掉掛載完成之前的el元素,這時掛載正式結束,掛載完成之後等待資料的更新,如果有資料更新時觸發breforeUpdata鉤子函式,通過虛擬DOM重新渲染這個頁面來更新資料,渲染結束就更新完成。當進入destroy方法的時候就進入銷燬期,進入銷燬期之後的vue 的方法將會被銷燬,消失死亡。