vue watch使用

Vue的watch属性用于监听Vue实例中的数据变化。当指定的数据发生变化时，会触发watch的回调函数。watch属性通常用于监听数据的变化，然后执行一些逻辑操作。

使用watch的基本语法如下：

watch: {
  // 监听的数据
  dataToWatch: function(newVal, oldVal) {
    // 数据变化时的回调函数
    // newVal为新值，oldVal为旧值
    // 执行一些操作
  }
}

在watch属性中可以监听多个数据，并指定不同的回调函数。当监听的数据发生变化时，会分别触发对应的回调函数。

除了基本的写法，watch还支持对象写法和深度监听。

对象写法：

watch: {
  dataToWatch: {
    handler: function(newVal, oldVal) {
      // 数据变化时的回调函数
      // 执行一些操作
    },
    deep: true // 深度监听
  }
}

深度监听：

watch: {
  dataToWatch: {
    handler: function(newVal, oldVal) {
      // 数据变化时的回调函数
      // 执行一些操作
    },
    deep: true // 深度监听
  }
}

当使用深度监听时，Vue会递归监听对象内部的所有属性。当对象内部的属性发生变化时，也会触发watch的回调函数。

除了基本的数据监听，watch还可以监听计算属性和方法的返回值。这样，当计算属性或方法的返回值发生变化时，也会触发watch的回调函数。

总结一下，Vue的watch属性用于监听数据的变化，并在数据变化时执行回调函数。可以监听基本的数据、计算属性、方法返回值，以及使用对象写法和深度监听