我们都知道vue的watch监听属性可以监听data中数据的变化
但是数组和对象的变化很多小白可能不太会,接下来我就为大家展示怎么监听数组和对象
废话不多说。上代码

  data() {
    return {
      arr: ["sss", "scsdr", 22],
      obj: {
        a: "bai",
        b: 2
      }
    };
  },

data中有一个数组和一个对象
接下来就是监听数组的变化

 watch: {
    arr: {
      handler(newVal, oldVal) {
        console.log(newVal);
        console.log(oldVal);
      }
    }
  }

arr是需要监听的数组,里面的函数会在数组变化是执行,两个参数分别是变化后和变化前

下面是对象的监听

 watch: {
    obj: {
      handler(val, oldval) {
        console.log(val, "sssssssssss");
        console.log(oldval, "=-=========");
      },
      deep: true
    }
  }

deep:其值是 true 或 false ;确认是否深入监听。deep 的意思就是深入观察,监听器会一层层的往下遍历,给对象的所有属性都加上这个监听器

Logo

前往低代码交流专区

更多推荐