Vue监听器watch的应用

watch监听器

什么是watch监听器：

• 监听器就是监测机制，可以监测vue中data数据的变化，并做相关处理。

• 关键字：watch

语法：

data(){
  return {
    name:'',
    cat:{
      leg:'',
      son:{
        name:'小黄',
        weight:50
      }
    }
  }  
}
watch:{
  // data成员名称:函数(新值，旧值){ }
  name:function(newv,oldv){ },
  // 对象成员监听
  'cat.leg':function(newv,oldv){ },  
  // 深度监听，内部任意成员变化都会感知到
   cat: { 
    handler: function (newv, oldv) { },
    deep: true
  },
}

说明：

1. 监听器既可以监听普通成员、也可以监听对象成员，还可以深度监听。
2. 一般this可以调用的成员属性都可以监听，例如computed计算属性，但是主要针对data做应用。
3. 深度监听，使用handler+deep关键字达成。