watch监听的几种写法:
<html>
<!--在这里插入内容-->
watch: {
// 适用于普通变量
a: function (val) {
console.log(000)
},
// 方法名
b: 'doing'
//用handler方法
c: {
//立即执行,在c声明之后就开始执行handler里面的内容
immediate: true,
//深度监听 监听C的属性 c.xxx
deep: true,
handler: function (val)
{0000000000000}
}
}
</html>1.handler方法
在项目中,有时会用到handler方法,有时则不会用到
handler方法有什么作用呢:
handler方法是 watch中的一个属性,是函数类型是规定的写法2.immediate方法
watch监听,是当对象发生变化时,才回去监听其变化.而immediate是在对象声明了之后,就开始去监听,watch里面的handler方法就开始执行.3.deep方法
Vue 不能监听到对象属性的添加和删除, deep 就排上了用场,监听器会一层一层的往下遍历,给对象的所有属性都加上这个监听器,从而监听到对象属性的变化.<html>
<!--在这里插入内容-->
data: {
obj: {
a:12
}
}
watch: {
'obj' : {
handler(val) {
console.log(val.a)
},
deep: true
}
}
</html>但是,也有别的方法---->就是直接监听obj的a属性
<html>
<!--在这里插入内容-->
data: {
obj: {
a:12
}
}
watch: {
'obj.a' : {
handler(val) {
console.log(val.a)
}
}
}
</html>