Vue3 watch 函数：监听数据变化的利器

在 Vue3 中，'watch' 函数用于监听数据的变化，并在变化时执行相应的回调函数。

'watch' 函数接收两个参数：要监听的数据和回调函数。回调函数在数据变化时被调用，并且接收两个参数：新值和旧值。

以下是 'watch' 函数的基本用法示例：

import { watch, reactive } from 'vue'

const state = reactive({
  count: 0
})

watch(() => state.count, (newValue, oldValue) => {
  console.log(`count changed from ${oldValue} to ${newValue}`)
})

state.count++ // 输出 count changed from 0 to 1

在上面的示例中，我们使用 'reactive' 函数创建了一个响应式对象 'state'，并定义了一个 'count' 属性。然后，我们使用 'watch' 函数监听 'state.count' 的变化，并在变化时打印出新值和旧值。

需要注意的是，Vue3 中的 'watch' 函数是一个独立的 API，与 Vue2 中的 'watch' 选项和 '$watch' 方法不同。