1. 程式人生 > >Vue-生命週期(鉤子函式)

Vue-生命週期(鉤子函式)

參考:https://cn.vuejs.org/v2/guide/instance.html

每個 Vue 例項在被建立時都要經過一系列的初始化過程——例如,需要設定資料監聽、編譯模板、將例項掛載到 DOM 並在資料變化時更新 DOM 等。同時在這個過程中也會執行一些叫做生命週期鉤子的函式,這給了使用者在不同階段新增自己的程式碼的機會。

生命週期圖示

   

介紹一下幾個鉤子函式:

beforeCreate:"元件例項化之前實現執行的函式"

created:"元件例項化完畢,但頁面還未顯示"

beforeMount:元件掛載前,頁面還未顯示,但虛擬dom已經配置"

mounted:"元件掛載後,此方法執行,頁面顯示"

beforeUpdate:"元件更新前,頁面仍未更新,但虛擬Dom已經配置"

updated:"元件元件更新,此方法執行後,頁面顯示"

beforeDestroy:"元件銷燬前"

destroyed:"元件銷燬"

例項在header元件新增:

程式碼參考:https://github.com/pengpengbhne/Vue/tree/master/chuanzhi

上一節:

https://blog.csdn.net/qq_35723619/article/details/83822793