- 普通监听
缺点：当值第一次绑定的时候，不会执行监听函数
<input type="text" v-model="age"/>
//监听 age值发生变化时触发
watch: {
age(newAge, oldAge) {
console.log(newAge)
}
}
- 第二种写法
只有当值改变的时候 才会执行，如果想在第一次绑定的时候执行此监听函数 则需要 设置immediate为true
<input type="text" v-model="age"/>
watch: {
age: {
handler (newAge, oldAge) {
console.log(newAge)
},
immediate: true
}
}
- 深度监听
当要监听对象或数组的时候需要添加deep:true 属性
<input type="text" v-model="userName.name" />
data (){
return {
userName: {name:'张三'}
}
},
watch: {
userName: {
handler(newName, oldName) {
console.log(newName)
},
immediate: true,
deep: true
}
}
