深度监听（vue中watch的deep）

当监听的是对象属性，手动修改对象的某个属性值是会发现，监听并没有生效，此时我们需要用到watch的deep属性，当deep为true时它会一层层遍历给对象的所有属性都加上这个监听函数，这样可以检测到对象的每个属性变化，但是这样做会造成更大的性能开销。

data:{
    obj:{
      a:1
    }
},
watch:{
    obj:{
      handler(newName,oldName){
          //...
      },
      deep:true //为true，表示深度监听，这时候就能监测到a值变化
    }
}

优化：可以使用字符串监听，即给对象会改变的属性指定该监听器，这样只有遇到该属性才会给其设置监听器，而不是给对象的所有属性都加上监听函数。

data:{
    obj:{
      a:1
    }
},
watch:{
    'obj.a':{
      handler(newName,oldName){
          //...
      },
      deep:true //为true，表示深度监听，这时候就能监测到a值变化
    }
}

例如之前动态修改echarts配置属性中的data值