对象 this.$set（obj, key, value）

我们想在当前对象添加新属性时，视图层并未更新显示这个新属性。

代码如下：

template片段

script片段

浏览器显示

这是由于受JavaScript 的限制，vue.js 不能监听对象属性的添加和删除，因为在vue组件初始化的过程中，会调用 getter 和 setter 方法，所以该属性必须是存在在data 中，视图层才会响应该数据的变化。

解决方案1：

使用 this.$set（object，key，value）

script片段

浏览器显示

解决方法2：

使用 Object.assign（target，sources）

script片段

浏览器显示

以上两种方法，都可以看到它的对象身上多了 set，get 方法，所以下次再操作就可以看到视图的变化。

集合 this.$set（array, index, object）

template片段

script片段

浏览器显示

浏览器显示