當(dāng)需要在數(shù)據(jù)變化時執(zhí)行異步或開銷較大的操作時丧诺，這個方式是最有用的脯颜。例如ajax請求悠汽，復(fù)雜的業(yè)務(wù)邏輯處理等健民。
不應(yīng)該使用箭頭函數(shù)來定義 watcher 函數(shù) (例如 searchQuery: newValue => this.updateAutocomplete(newValue))抒巢。
基礎(chǔ)用法
數(shù)據(jù)初始化
data() {
return {
a: 1,
b: 'enen',
shipStatusArr: {
name: 'zhangsanlisi',
age: 12
}
}
}
mounted
mounted () {
this.a = 2
this.shipStatusArr.name = 'lisi'
}
watch
- watch基本數(shù)據(jù)類型（string，number等）
watch: {
a: function (newValue, oldVal) {
console.log( newValue, oldVal )
}
}
- watch對象
watch: {
shipStatusArr: {
handler(newValue, oldValue) {
console.log(newValue, oldValue)
},
deep: true
}
}
進(jìn)階用法
監(jiān)聽某一屬性
以上監(jiān)聽shipStatusArr的用法秉犹，會在shipStatusArr中任一屬性變化時觸發(fā)蛉谜，如果是只監(jiān)聽shipStatusArr的name變化稚晚，更優(yōu)寫法是：
watch: {
'shipStatusArr.name': function (newValue, oldVal) {
console.log( newValue, oldVal )
}
}
immediate
回調(diào)將會在偵聽開始之后被立即調(diào)用
watch: {
shipStatusArr: {
handler(newValue, oldValue) {
console.log(newValue, oldValue)
},
deep: true,
immediate: true
}
}
