vue项目中Watch(监听)使用方法和场景

1.watch用法

（1）

watch: {
    data: {//需要监听的变化的数据
      handler(val) {//里面写当数据变化时执行的操作
        console.log("watch", val);
        this.getdata();
      },
      immediate: true,//第一次是否监听
      deep: true,//是否深度监听
    },
  },

2.、immediate、handler和deep属性详解

（1）immediate : 值为true或false；当需要数据第一次绑定时就监听值为true就行，反之false

（2）deep 值为true或false；是否深度监听数据，当数据为引用类型（object，数组[]等）我们需要加上deep：true。

3.使用场景举例

 

 需要根据上面选择日期的变化去实时改变图表的数据

我们可以监听时间框的时间，如果有变动去请求接口获取数据。

有问题欢迎留言讨论！感谢支持