vue3.0 的watch函数

Vue 3.0 中的 `watch` 函数是响应式系统的一部分，它允许你在属性发生改变时执行一些自定义的回调操作。相比于 Vue 2.x 的 `$watch`，Vue 3 引入了更简洁易用的 `watch` API。`watch` 可以接受两个参数：

1. **getter**：这是可选的，如果提供，当依赖的数据发生变化时，会自动触发回调。它是一个返回值的函数，类似于计算属性。
2. **setter**：这是一个必填的函数，会在属性被新值赋值时被调用。这通常是更新外部状态的地方，比如 DOM 或者模型本身。

`watch` 还可以接收第三个参数，称为 **deep**，默认为 false，表示浅比较；如果设为 true，则会对嵌套的对象或数组做深度监听。

例如：

watch('myValue', (newVal, oldVal) => {
  console.log(`New value: ${newVal}, Old value: ${oldVal}`);
});

// 或者使用 getter 和 setter
watch(
  () => this.computedValue,
  (newVal) => this.handleComputedChange(newVal),
  { deep: true }
);