Vue 添加响应式属性 使其自动触发视图更新

原因:

    受现代 JavaScript 的限制 (以及废弃 Object.observe),Vue 不能检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的。例如:

varvm =newVue({  data:{a:1  }})

// `vm.a` 是响应的

vm.b =2

// `vm.b` 是非响应的

方法:

Vue 不允许在已经创建的实例上动态添加新的根级响应式属性 (root-level reactive property)。然而它可以使用 Vue.set(object, key, value) 方法将响应属性添加到嵌套的对象上

原理:

有空再来阅读vue的响应式原理的源码

你可能感兴趣的:(Vue 添加响应式属性 使其自动触发视图更新)