vue中watch 深度监听 立即监听

可以通过设置选项`immediate:true`来实现，在watch选项中添加`deep:true`和`handler`函数后，再加上`immediate:true`选项即可立即监听。例如：

  watch: {
    obj: {
      deep: true,
      immediate: true,
      handler: function(val, oldVal) {
        console.log('obj changed');
      }
    }
  }

这样在组件挂载后，`obj`的变化会立即触发`handler`函数。同时由于添加了`deep:true`选项，如果`obj`是一个对象或者数组，那么其内部属性或元素的变化也能被监听到。

相关问题

vue2 watch 深度监听

Vue2中的watch可以通过设置deep属性来实现深度监听，当需要监听一个对象的改变时，普通的watch方法无法监听到对象内部属性的改变，此时就需要deep属性对对象进行深度监听。如果只需要监听对象中的一个属性值，则可以使用字符串的形式监听对象属性。同时，还可以设置immediate属性来在第一次改变时就执行监听方法。

vue2 watch深度监听

Vue 2 中的 `watch` 选项默认是浅监听的，即只监听对象或数组的引用变化。如果想要实现深度监听，可以通过设置 `immediate: true` 和 `deep: true` 来实现。

watch: {
  objectToWatch: {
    handler(newVal, oldVal) {
      console.log('Object changed:', newVal);
    },
    immediate: true,
    deep: true
  }
}

在上面的示例中，`objectToWatch` 是要监听的对象，`handler` 是监听到变化时触发的回调函数。`immediate: true` 表示在组件加载时就立即执行一次回调函数，`deep: true` 表示进行深度监听。

请注意，深度监听可能会带来性能问题，因为它需要递归遍历整个对象或数组来检测变化。因此，尽量在必要的情况下使用深度监听，以避免性能影响。