javascript - vue.js 如何watch对象属性的变化

Question

var vm = new Vue({
  data: {
    b: 'xx',
    c: 'xx',
    obj: {
        a: 'xx'
    }
  }
})

监听b: vm.$watch('b', function (val) {
xxx
})

监听obj.a应该怎么做？

Answer 1

API文档：http://cn.vuejs.org/api/#watch

Answer 2

使用深度watch：

vm.$watch('obj', {
    deep: true,
    handler: function(val, oldVal) {}
});

Answer 3

vm.$watch('obj.a', function(newVal,oldVal){
xxx
});

Answer 4

watch:{

['obj.a'](){}

}

Answer 5

return({
      a: 1,
      b: 2,
      list: [{
        a: '数值1'
      },{
        a: '数值2'
      },{
        a: '数值3'
      }]
    })
    list: {
    deep: true,
    handler: function(val, oldVal) {
      var list_arr = Array.from(val);
      console.log(list_arr)
    }
}

这是我写的监听数组，跟你那个类似。