vue3中watchEffect怎么使用

在Vue 3中，可以使用watchEffect函数来创建一个响应式的副作用。它接收一个函数作为参数，在函数中可以访问响应式的数据，并在其中定义副作用的逻辑。当响应式的数据发生变化时，副作用会被重新执行。

以下是一个使用watchEffect的示例：

import { reactive, watchEffect } from 'vue';

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

watchEffect(() => {
  console.log('Count changed:', state.count);
});

// 修改响应式的数据
state.count++; // 输出：Count changed: 1
state.count++; // 输出：Count changed: 2

在上面的示例中，我们创建了一个响应式的state对象，其中包含一个count属性。然后，我们使用watchEffect创建了一个副作用，当state.count发生变化时，副作用会重新执行，并打印出新的count值。

需要注意的是，watchEffect会在组件挂载时立即执行一次，并在其依赖的响应式数据发生变化时重新执行。因此，它适用于处理那些无需指定具体依赖的副作用。如果你需要指定具体的依赖项，可以使用watch函数