let vm = new Vue({
el: '#el'
data: {
o: 'object',
dog: {}
},
method: {
clickHandler () {
// 该 name 属性是否是响应式的
this.dog.name = 'Trump'
}
}
})
题目中通过 this.dog.name = 'Trump'
给 dog 增加的成员 不是响应式数据。
在 Vue 中可以通过 Vue.set( target, propertyName/index, value )
或者 this.$set( target, propertyName/index, value )
的方式为 target 对象动态添加响应式数据。Vue 2.x 中的原理是:类似于调用 defineReactive(obj, key, val)
方法,利用 Object.defineProperty
的 getter 和 setter 实现响应式数据。