watch:{//监控选项卡，自动切换页眉activeName: {handler(){if(this.activeName === 'first'){this.listPageMenuName='知识库管理'this.listPageTitle= '查看知识库'}else if(this.activeName === 'second'){this.listPageMenuName='分类管理'this.listPageTitle= '添加分类'}},immediate: true}}
类型：{ [key: string]: string | Function | Object | Array }
详细：
一个对象，键是需要观察的表达式，值是对应回调函数。值也可以是方法名，或者包含选项的对象。Vue 实例将会在实例化时调用$watch()，遍历 watch 对象的每一个属性。
示例：
var vm = new Vue({data: {a: 1,b: 2,c: 3,d: 4,e: {f: {g: 5}}},watch: {a: function (val, oldVal) {console.log('new: %s, old: %s', val, oldVal)},// 方法名b: 'someMethod',// 该回调会在任何被侦听的对象的 property 改变时被调用，不论其被嵌套多深c: {handler: function (val, oldVal) { /* ... */ },deep: true},// 该回调将会在侦听开始之后被立即调用d: {handler: 'someMethod',immediate: true},e: ['handle1',function handle2 (val, oldVal) { /* ... */ },{handler: function handle3 (val, oldVal) { /* ... */ },/* ... */}],// watch vm.e.f's value: {g: 5}'e.f': function (val, oldVal) { /* ... */ }}})vm.a = 2 // => new: 2, old: 1
注意，不应该使用箭头函数来定义 watcher 函数(例如searchQuery: newValue => this.updateAutocomplete(newValue))。理由是箭头函数绑定了父级作用域的上下文，所以this将不会按照期望指向 Vue 实例，this.updateAutocomplete将是 undefined。
如果觉得《vue中的watch监听数据变化》对你有帮助，请点赞、收藏，并留下你的观点哦！
