vue选项式中watch深度监听的写法

在Vue选项式中，可以通过`watch`选项的第二个参数来开启深度监听。第二个参数可以是一个布尔值或一个对象，其中`deep`属性表示是否开启深度监听。如果`deep`属性为`true`，则表示开启深度监听。

下面是一个示例：

import { watch } from 'vue';

export default {
  data() {
    return {
      message: 'Hello Vue!',
      data: {
        name: 'Tom',
        age: 20
      }
    };
  },
  setup() {
    watch(
      () => data,
      (newVal, oldVal) => {
        console.log('data对象或子属性发生变化');
      },
      { deep: true }
    );
  }
};

在上述示例中，使用了Vue 3中的`watch`函数来实现深度监听。在`watch`函数的第三个参数中开启了`deep`属性，当`data`对象或其子属性发生变化时，`watch`函数的第二个参数就会被触发。

需要注意的是，在Vue 3中，选项式API和组合式API的写法有所不同，需要根据具体的情况来选择使用哪种API。如果需要在组件中使用组合式API，需要使用`setup`函数来实现。