问题
很早之前就遇到一个问题,父组件向子组件传值,子组件监听传入对象的某个属性。发现子组件使用deep watch都不能观察到对象中属性的变化,今天终于找到为啥出现这种问题和解决办法了。
为啥出现这种问题?受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。
解决方式:
通过vue的this.$set(object,key,value)方法
通过object.assign()重新创建一个对象,例如this.someObject = Object.assign({},this.someObject,{ a: 1,b: 2 })
代码实例
总结
个人推荐使用第二种解决方式,代码写起来更优雅。第一种解决方式如果有多个值会出现,多行$set()语句。
以上这篇解决Vue2.0 watch对象属性变化监听不到的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。
原文链接:https://www.f2er.com/vue/30312.html