vue侦听器（Watch）精彩案例剖析一

目录

watch介绍

监视普通数据类型

监视对象类型

---

watch介绍

---

        在 Vue 中，watch主要用于监视数据的变化，并执行相应操作。一旦被监视的属性发生变化，回调函数将自动被触发。当在 Vue 中使用watch来响应数据变化时，首先要清楚，watch本质上是一个对象，且必须以对象的形式来运用。该对象包含key和value。

        key：代表需要监视的元素，即属性，例如路由的变化、data中的某个变量，或者computed对象里的属性等。这里的属性应与要监视的data或computed对象中的属性同名，并且无需用单引号包裹。

        value：为函数，当所监视的key发生变化时，将执行此函数。该函数的第一个参数是新值，第二个参数是旧值。

监视普通数据类型

---

        handler的值是一个回调函数，即当监听到变化时需要执行的函数。回调函数接收两个参数，分别是新值（newValue）和旧值（oldValue）。

        watch还有一些配置选项，如：

        immediate：该选项用于表明在watch首次绑定时，是否立即执行handler。若值为true，则在watch声明时即刻执行handler方法；若值为false，则仅在数据发生变化时执行，其默认值为fal