-
作用 用于监听数据的变化
-
类型 { [key: string]: string | Function | Object | Array }
-
详细
一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。Vue 实例将会在实例化时调用
$watch()
,遍历 watch 对象的每一个 property。
-
示例
1 var vm = new Vue({ 2 data: { 3 a: 1, 4 b: 2, 5 c: 3, 6 d: 4, 7 e: { 8 f: { 9 g: 5 10 } 11 } 12 }, 13 watch: { 14 a: function (val, oldVal) { 15 console.log(‘new: %s, old: %s‘, val, oldVal) 16 }, 17 // 方法名 18 b: ‘someMethod‘, 19 // 该回调会在任何被侦听的对象的 property 改变时被调用,不论其被嵌套多深 20 c: { 21 handler: function (val, oldVal) { /* ... */ }, 22 deep: true 23 }, 24 // 该回调将会在侦听开始之后被立即调用 25 d: { 26 handler: ‘someMethod‘, 27 immediate: true 28 }, 29 // 你可以传入回调数组,它们会被逐一调用 30 e: [ 31 ‘handle1‘, 32 function handle2 (val, oldVal) { /* ... */ }, 33 { 34 handler: function handle3 (val, oldVal) { /* ... */ }, 35 /* ... */ 36 } 37 ], 38 // watch vm.e.f‘s value: {g: 5} 39 ‘e.f‘: function (val, oldVal) { /* ... */ } 40 } 41 }) 42 vm.a = 2 // => new: 2, old: 1