一、基本使用
1. 写法一：侦听watch时，传入一个getter函数
const info = reactive({ name: "coco", age: 10 })
watch(() => info.name, (newValue, oldValue) => {
console.log("newValue: ", newValue);
console.log("oldValue: ", oldValue);
})
2. 写法二：传入一个可响应式对象：ref对象 reactive对象
情况一：reactive对象获取到的newValue和oldValue本身都是reactive对象
情况二：ref对象获取newVlaue和oldValue是value值的本身
二、watch侦听多个数据源
1. 写法一：Array （获取到的对象是reactive对象）
watch([info, name], (newValue, oldValue) => {
console.log("newValue: ", newValue);
console.log("oldValue: ", oldValue);
})
2. 写法二：getter函数，并且对可响应对象进行解构（获取到的普通数组或对象）
watch(() => [{ ...info }, name], (newValue, oldValue) => {
console.log("newValue: ", newValue);
console.log("oldValue: ", oldValue);
})
三、深度监听
1. 监听 reactive对象/数组时，默认便有深度监听
2. 监听普通对象/数组时，watch添加第三个参数{deep:true} 即可
四、立即执行
watch添加第三个参数{immediate: true} 即可
五、watchEffect（自动收集响应式的依赖）
1. 第一个参数：
2. 第二个参数：flush 执行时机（不推荐）
