Vue2.0 $set()的正确使用详解，解决数据更新页面不更新问题

作用：vue2.0 给data对象新增属性，并触发视图更新

 

受 ES5 的限制，Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter，所以属性必须在 data 对象上才能让 Vue.js 转换它，才能让它是响应的。

 

要处理这种情况，我们可以使用$set()方法，既可以新增属性,又可以触发视图更新。

 Vue 不能检测以下变动的数组：

当你利用索引直接设置一个项时，例如：vm.items[indexOfItem] = newValue

当你修改数组的长度时，例如：vm.items.length = newLength

例如：使用 this.arr[0] 去更新 array 的内容，视图没有刷新。