对象属性监听的两种方法:函数
1.普通的watchthis
data() { return { frontPoints: 0 } }, watch: { frontPoints(newValue, oldValue) { console.log(newValue) } }
2.对象属性的watchspa
data() { return { bet: { pokerState: 53, pokerHistory: 'local' } } }, watch: { bet: { handler(newValue, oldValue) { console.log(newValue) }, deep: true } }
tips: 只要bet中的属性发生变化(可被监测到的),便会执行handler函数;
若是想监测具体的属性变化,如pokerHistory变化时,才执行handler函数,则能够利用计算属性computed作中间层。
事例以下:code
3.对象具体属性的watch对象
data() { return { bet: { pokerState: 53, pokerHistory: 'local' } } }, computed: { pokerHistory() { return this.bet.pokerHistory } }, watch: { pokerHistory(newValue, oldValue) { console.log(newValue) } }
对象具体属性的watch能够直接用引号把属性括起来,就能够实现对象中特定属性的监听事件:blog
data() { return { bet: { pokerState: 53, pokerHistory: 'local' } } }, watch: { 'bet.pokerHistory'(newValue, oldValue) { console.log(newValue) } }