一.什么是侦听器
watch侦听器允许开发者监视数据的变化.针对数据的变化进行一些操作.
二.侦听器的两种格式
1.方法格式的侦听器
缺点1:无法在刚进入页面的时候 , 自动触发!!!
缺点2:如果侦听的是一个对象,对象中的属性发生了变化,是侦听不到的!!!
watch:{
//要监视哪个数据的变化,就把哪个数据作为方法名即可
username(newVal,oldVal){
console.log(newval,oldval)
}
}
2.对象格式的侦听器
好处1:可以通过 immediate选项,让侦听器自动触发!!!
好处2:可以通过deep选项,让侦听器实现深度监听!!!
watch: {
//定义对象格式的侦听器
username: {
immediate:true//默认为false,初始化自动调用一次
deep:true //实现深度监听
//侦听器的处理函数
handler( newVal,oldVal) {
console.log(newval,oldval)
},
}
}
三,侦听器的应用场景
四,deep(深度监听)
对象和数组都是引用类型,引用类型变量存的是地址,地址没有变,所以不会触发watch。这时我们需要进行深度监听,就需要加上一个属性 deep,值为 true.
五.监听对象单个属性的变化写法
watch: {
'info.username' : {
handler(newVal) {
console.log(newVal)
}
}
}