<div>
      <p>obj.a: {{obj.a}}</p>
      <p>obj.a: <input type="text" v-model="obj.a"></p>
</div>
 
new Vue({
  el: '#app',
  data: {
    obj: {
      a: 66,
      b:'总'
    }
  }

监听一个对象的全部属性:

 watch: {
    obj: {
      handler(newName, oldName) {
         console.log('数据改变了');
      },
          //immediate:true代表如果在 wacth 里声明了obj之后,就会立即先去执行里面的handler方法,
      immediate: true, 
      deep: true // 开启深度监听,默认是false
    }
  }

监听一个对象的某一个属性:

watch: {
  'obj.a': {
    handler(newName, oldName) {
      console.log('obj.a changed');
    },
    immediate: true
  }
}

————————————————
版权声明:本文为CSDN博主「尹东」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/yinge0508/article/details/105818131

Logo

前往低代码交流专区

更多推荐