Vue 侦听器watch

侦听器就是侦听data中的数据变化，如果数据一旦发生变化就通知侦听器所绑定方法，来执行相应的操作。从这一点上，与计算属性是非常类似的。

但是，侦听器也有自己独有的应用场景。

执行异步或开销较大的操作。

下面，先来看一下侦听器的基本使用

我们使用侦听器来统计总人数。

 <p>
   
        总人数：{
  {totalCount}}
      </p>

在data中定义totalCount属性。

 data: {
          selectItem: "",
          num: 100,
          totalCount: 0
       }  

使用watch来监听users数组的数据变化。

 watch: {
          users: {
            immediate: true, //立即执行
            handler(newValue, oldValue) {
              this.totalCount = newValue.length + "个人";
            },
          },
        }

当users数组发生了变化后，就会执行handler这个函数，同时用于加上了immediate属性，并且该属性的值为