Vue之监听属性

一，什么是监听属性

        监听属性是Vue.js提供的一种用来监听和响应Vue实例中的数据变化的方式。在监听数据对象中的属性时，每当监听的属性发生变化，都会执行特定的操作。监听属性可以定义在watch选项中，也可以使用实例方法vm.$watch()。

        在watch选项中定义监听属性的示例代码如下：

运行结果如图：

        上述代码中，在watch选项中对fullname属性进行了监听。当改变该属性值的时候，会执行对应的回调函数，函数中的两个参数newValue和oldValue分别表示监听属性的新值和旧值。其中，第二个参数可以省略。

        使用实例方法vm。Swatch()定义监听属性的示例代码如下: 

        上述代码中，应用实例方法vm.$watch()对fullname属性进行了监听。运行结果跟上图一致。

        应用监听属性实现人民币和美元之间的汇率换算，代码如下：

	¥：

    $：

	{{rmb}}人民币={{dollar | formatNum}}美元

运行结果如图：

二，deep选项 

        如果要监听的属性值是一个对象，为了监听对象内部值的变化，可以在选项参数中设置deep选项的值为true。示例代码如下：

        运行结果如图：

 当监听数据是一个数组或者对象时，回调函数中的新值和旧值是相等的，因为这两个形参指向是同一个数据对象