Vue 3 watchEffect 多个响应式变量监听

在 Vue 3 中，watchEffect 可以接受多个响应式变量作为参数。当其中任何一个变量发生变化时，watchEffect 函数都会被重新执行。例如：

import { watchEffect, reactive } from 'vue'

const state = reactive({
  count1: 0,
  count2: 0,
})

watchEffect(() => {
  console.log('Count1: ' + state.count1)
  console.log('Count2: ' + state.count2)
})

state.count1++ // 输出 'Count1: 1'
state.count2++ // 输出 'Count2: 1'

在上面的例子中，我们使用 watchEffect 监听了 state 对象中的 count1 和 count2 两个属性。当任何一个属性发生变化时，watchEffect 中的函数都会被重新执行，并输出相应的计数值。