【Vue基础】监听属性watch

 Vue监听属性是 watch&＃xff0c;我们可以通过 watch 来响应数据的变化 。

代码示例&＃xff1a;

&＃xff01; watch可以对原有属性进行监听&＃xff0c;也可以对计算属性进行监听。当所监听的属性发生变化时&＃xff0c;回调函数被调用&＃xff0c;回调函数有变化后的值和变化前的值两个参数。

运行结果&＃xff1a; 

监视有两种写法&＃xff1a;可以通过.new Vue时传入watch配置&＃xff08;如上&＃xff09;&＃xff1b;可以通过vm.$watch&＃xff08;如下&＃xff09;&＃xff0c;效果一样。 

// $watch 是一个实例方法vm.$watch(&＃39;isHappy&＃39;, function (newValue, oldValue) {console.log(&＃39;isHappy发生了改变&＃39;,newValue,oldValue)}, {deep: true,//开启深度监视immediate: true,//初始化时立即调用一次回调函数});

 deep和immediate不需要时可以不配置。