当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。例如ajax请求，复杂的业务逻辑处理等。
不应该使用箭头函数来定义 watcher 函数 (例如 searchQuery: newValue => this.updateAutocomplete(newValue))。
基础用法
数据初始化
data() {
return {
a: 1,
b: 'enen',
shipStatusArr: {
name: 'zhangsanlisi',
age: 12
}
}
}
mounted
mounted () {
this.a = 2
this.shipStatusArr.name = 'lisi'
}
watch
- watch基本数据类型（string，number等）
watch: {
a: function (newValue, oldVal) {
console.log( newValue, oldVal )
}
}
- watch对象
watch: {
shipStatusArr: {
handler(newValue, oldValue) {
console.log(newValue, oldValue)
},
deep: true
}
}
进阶用法
监听某一属性
以上监听shipStatusArr的用法，会在shipStatusArr中任一属性变化时触发，如果是只监听shipStatusArr的name变化，更优写法是：
watch: {
'shipStatusArr.name': function (newValue, oldVal) {
console.log( newValue, oldVal )
}
}
immediate
回调将会在侦听开始之后被立即调用
watch: {
shipStatusArr: {
handler(newValue, oldValue) {
console.log(newValue, oldValue)
},
deep: true,
immediate: true
}
}
