Vue -- watch用法

watch的作用可以监控一个值的变换，并调用因为变化需要执行的方法。可以通过watch动态改变关联的状态。

vue watch用法

data:{
     a:1,
     b:{
         c:1
     }
 },
 watch:{
     a(val, oldVal){                         //普通的watch监听
         console.log("a: "+val, oldVal);
     },
     b:{                                     //深度监听，可监听到对象、数组的变化
         handler(val, oldVal){
             console.log("b.c: "+val.c, oldVal.c);//但是这两个值打印出来却都是一样的
         },
         deep:true
     }
 }

watch 是一个对象，对象就有键，有值。

值可以是函数：就是当你监控的家伙变化时，需要执行的函数，这个函数有两个形参，第一个是变化后的值，第二个是变化前的值。

值也可以是函数名：不过这个函数名要用单引号来包裹。

值是包括选项的对象：选项包括有三个。

第一个handler：其值是一个回调函数。即监听到变化时应该执行的函数。

第二个是deep：其值是true或false；确认是否深入监听。deep的意思就是深入观察，监听器会一层层的往下遍历，给对象的所有属性都加上这个监听器（受现代 JavaScript 的限制 (以及废弃 Object.observe)，Vue 不能检测到对象属性的添加或删除）

第三个是immediate：其值是true或false；immediate:true代表如果在 wacth 里声明了之后，就会立即先去执行里面的handler方法，如果为 false就跟我们以前的效果一样，不会在绑定的时候就执行