在我们使用vue进行开发的过程中，可能会遇到一种情况：当生成vue实例后，当再次给数据赋值时，有时候并不会自动更新到视图上去； 当我们去看vue文档的时候，会发现有这么一句话：如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。 如下代码，给 student对象新增 age 属性
受 es5 的限制，vue.js 不能检测到对象属性的添加或删除。因为 vue.js 在初始化实例时将属性转为 getter/setter，所以属性必须在 data 对象上才能让 vue.js 转换它，才能让它是响应的。
正确写法：this.$set(this.data,”key”,value’)
:: vue 不允许动态添加根级响应式属性。
例如：
只可以使用 vue.set(object, propertyname, value) 方法向嵌套对象添加响应式属性，例如
vue.set()和this.$set()实现原理
我们先来看看vue.set()的源码：
再来看看this.$set()的源码：
结果我们发现vue.set()和this.$set()这两个api的实现原理基本一模一样，都是使用了set函数。set函数是从 ../observer/index 文件中导出的，区别在于vue.set()是将set函数绑定在vue构造函数上，this.$set()是将set函数绑定在vue原型上。
我们发现set函数接收三个参数分别为 target、key、val，其中target的值为数组或者对象，这正好和官网给出的调用vue.set()方法时传入的参数参数对应上。
参考：
到此这篇关于vue.set()和this.$set()使用和区别的文章就介绍到这了,更多相关vue.set()和this.$set()内容请搜索www.887551.com以前的文章或继续浏览下面的相关文章希望大家以后多多支持www.887551.com！
