new Vue({
el:'#id',
data(){ //數據對象
return {
demo: {
name: ''
}，
user:'',
};
}，
mounted: function () { //頁面加載完成后執行的方法
},
methods: { //盒子中所有方法
}，
created() { //實例被創建時候執行
}，
computed: {
newName() {
return this.demo.name;
}
},
watch: { //監聽數據前后變化
firstName: function (val, oldVal) { //如果watch監測的是一個對象的話，直接使用watch是不行的，此時我們可以借助於computed計算屬性來完成
} //或者在鍵路徑加上引號
‘demo.name’:function (val, oldVal) {
}
user: function (val, oldVal) { //數據前后變化 }
},
})
beforeCreate: function () {
console.group('beforeCreate 創建前狀態===============》');
},
created: function () {
console.group('created 創建完畢狀態===============》');
},
beforeMount: function () {
console.group('beforeMount 掛載前狀態===============》');
},
mounted: function () {
console.group('mounted 掛載結束狀態===============》');
},
beforeUpdate: function () {
console.group('beforeUpdate 更新前狀態===============》');
},
updated: function () {
console.group('updated 更新完成狀態===============》');
},
beforeDestroy: function () {
console.group('beforeDestroy 銷毀前狀態===============》');
},
destroyed: function () {
console.group('destroyed 銷毀完成狀態===============》');
}
beforecreated：el 和 data 並未初始化
created:完成了 data 數據的初始化，el沒有
beforeMount：完成了 el 和 data 初始化
mounted ：完成掛載