https://www.jianshu.com/p/9ada0b5f04d5?utm_campaign

vue可以通过watch监听data内数据的变化。通常写法是：

new Vue({  data: {    a: 100，    msg:{        channel:'音乐',        style:'活泼'    }  },  watch: {    a: function (newval, oldVal) {      console.log('new: %s, old: %s', newval, oldVal)    }  }})

　　

但是如果你要监听的数据是对象内的某一属性，直接watch对象的属性(eg:msg.channel)就会报错

而监听整个对象的时候（eg:msg）会发现无论何时newval和oldVal的值都是一样的，这是因为msg这个对象的指向并没有发生改变，所以需要深度监测

watch: {    msg: {        handler(newValue, oldValue) {            console.log(newValue)        },        deep: true    }}

如果监听对象内的某一具体属性，可以通过computed做中间层来实现

computed: {    channel() {        return this.msg.channel    }},watch:{    channel(newValue, oldValue) {        console.log('new: %s, old: %s', newval, oldVal)        //这里面可以执行一旦监听的值发生变化你想做的操作    }}

尊重版权哦！

作者：形影相随_371e

链接：https://www.jianshu.com/p/9ada0b5f04d5

来源：简书

简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。