所谓响应式就是当事物发生变化时会根据变化做出相应的反映。
Vue 中的数据 data 是响应式的,Vue 通过 Object.defineProperty()函数 来用 getter和setter方法 对 data 数据做了代理和监听,一旦数据发生变化,Vue 就会改变数据对应的 UI 视图,这就是 Vue的数据响应式
但是 Vue 使用 Object.defineProperty 来设置监听,就只能对在 Vue实例化 时 data 对象里已经存在的属性设置监听,而对不存在的或者后来添加进去的属性没有进行监听。
- 解决办法
- 先把key都声明好,后面不再加属性不就行了
- 使用Vue.set或者this.$set
- 数组变异