<template id="my-app">
<button @click="changeInfo">改变info</button>
<button @click="changeInfoName">改变info.name</button>
<button @click="changeInfoNpcName">改变info.npc.name</button>
<h3>
{{info.name}}
{{info.npc?info.npc.name : " "}}
</h3>
</template>
data () {
return {
info: {
name: "Ale",
age: 16,
npc: {
name: "LiLei"
}
}
}
},
created() {
this.unwatch = this.$watch("info", function(newVal, oldVal) {
console.log(newVal, oldVal);
}, {
deep: true,
immediate: true
})
},
methods: {
changeInfo() {
this.info = { name: "kobe" };
},
changeInfoName() {
this.info.name = "Alice";
},
changeInfoNpcName() {
this.info.npc.name = "Hanmeimei";
}
}