vue3 watch不生效

在Vue3中，watch的使用方式与Vue2有所不同。如果你在Vue3中遇到watch不生效的问题，可能是因为watch的源不正确导致的。根据引用中的错误提示信息，watch的源只能是getter函数、effect函数、ref、reactive对象或这些类型的数组。

下面是一个示例，演示了在Vue3中如何正确使用watch：

import { watch, reactive } from 'vue';

const state = reactive({
  count: 0,
});

watch(() => state.count, (newValue, oldValue) => {
  console.log(`count发生了变化，新值为：${newValue}，旧值为：${oldValue}`);
});

// 修改count的值
state.count = 1; // 输出：count发生了变化，新值为：1，旧值为：0

在上面的示例中，我们使用了`watch`函数来监听`state.count`的变化。`watch`函数接受两个参数：第一个参数是watch的源，这里使用了一个getter函数`() => state.count`；第二个参数是回调函数，当`state.count`发生变化时，回调函数会被调用，并传入新值和旧值作为参数。

请注意，为了使用Vue3的`watch`函数，你需要先安装Vue3的版本，并在代码中引入相应的模块。