vue3【watch检测/监听】watch检测数据变化&&监听使用

watch介绍

• 计算属性允许我们声明性地计算衍生值。然而在有些情况下，我们需要在状态变化时执行一些“副作用”：例如更改 DOM，或是根据异步操作的结果去修改另一处的状态。
• 在组合式 API 中，我们可以使用 watch函数在每次响应式状态发生变化时触发回调函数。

vue中watch用来监听数据的响应式变化.获取数据变化前后的值

watch的完整入参

watch(监听的数据，副作用函数，配置对象)
watch(data, (newData, oldData) => {}, {immediate: true, deep: true})

 watch有2个参数：

• 第一个参数是监听的数据对象, 可以是单个变量、数组、函数
• 第二个参数是数据改变时的回调函数, 有2个参数, 第一个是改变后的数据, 第二个是改变前的数据

watch监听示例

侦听一个 getter 函数：

const state = reactive({ count: 0 })
watch(
  () => state.count,
  (count, prevCount) => {
    /* ... */
  }
)

 侦听一