<html>
<div id="app">
<h2>{{ info.name }}</h2>
<button @click="changeInfo">修改info</button>
</div>
</html>
<script>
export default{
data() {
return {
info: { name: "why", age: 18 }
}
},
methods: {
changeInfo() {
// 1.创建一个新对象, 赋值给info
// this.info = { name: "kobe" }
// 2.直接修改原对象某一个属性
this.info.name = "kobe"
}
},
watch: {
// 默认watch监听不会进行深度监听
// info(newValue, oldValue) {
// console.log("侦听到info改变:", newValue, oldValue)
// }
// 进行深度监听
info: {
handler(newValue, oldValue) {
console.log("侦听到info改变:", newValue, oldValue)
console.log(newValue === oldValue)
},
// 监听器选项:
// info进行深度监听
deep: true,
// 第一次渲染直接执行一次监听器
immediate: true
},
//监听单个属性，（不常用）
"info.name": function(newValue, oldValue) {
console.log("name发生改变:", newValue, oldValue)
}
}
}
</script>
扫一扫
07-17
425
425
07-15
1万+
1万+
11-15
304
304
10-13
5547
5547
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
