2019-11-16 seo達(dá)人
vue 生命周期
每個 Vue 實例在被創(chuàng)建時都要經(jīng)過一系列的初始化過程。設(shè)置數(shù)據(jù)監(jiān)聽、編譯模板、掛載等等。vue生命周期還是不太容易理解,這里就簡單地說一下它的整個過程。
1創(chuàng)建一個vue實例
new vue({
data () {
return {
}
}
})
2 初始化事件和生命周期 beforeCreate 創(chuàng)建實例之前執(zhí)行的鉤子函數(shù)
3 初始化·注入和校驗 created 實例創(chuàng)建完成后執(zhí)行的鉤子
new vue ({
data () {
return {
a: 1
}
},
created: function () {
console.log('created')
}
})
4 渲染頁面 編譯 beforeMount 將編譯完成的html掛載在虛擬dom時執(zhí)行的鉤子
5 mouted鉤子 掛載完畢對數(shù)據(jù)進行渲染 會做一些ajax情求初始化數(shù)據(jù) mounted整個實例過程中只執(zhí)行一次
new vue ({
data () {
return {
a: 1
}
},
created: function () {
console.log('created')
},
// 一些鉤子函數(shù)
mouted: function () {
console.log('mounted')
}
})
6 修改數(shù)據(jù) beforeUpdate 更新之前的鉤子
7 updated 修改完成重新渲染
8 準(zhǔn)備解除綁定子組件以及事件監(jiān)聽器 beforeDestroy
9 銷毀完成 destroyed
藍(lán)藍(lán)設(shè)計的小編 http://sillybuy.com