Vue3 watch多个变量

在Vue3中，可以使用`watchEffect`来监听多个变量的变化。

例如：

import { watchEffect, reactive } from 'vue'

const state = reactive({
  count: 0,
  name: 'John'
})

watchEffect(() => {
  console.log(`count: ${state.count}, name: ${state.name}`)
})

在上面的例子中，我们使用了`reactive`来创建响应式对象`state`，然后使用`watchEffect`来监听`state.count`和`state.name`的变化，当其中一个变量发生变化时，回调函数就会被执行。

如果想要监听具体的变量，可以使用`watch`函数：

import { watch, reactive } from 'vue'

const state = reactive({
  count: 0,
  name: 'John'
})

watch([() => state.count, () => state.name], ([count, name]) => {
  console.log(`count: ${count}, name: ${name}`)
})

在上面的例子中，我们使用了`watch`函数来监听`state.count`和`state.name`的变化，当其中一个变量发生变化时，回调函数就会被执行，并且可以获取到变化后的值。