vue this.setData,vue setup this
本文主要介绍如何使用这个。Vue中的$set()来添加新数据和更新视图。有很好的参考价值，希望对大家有所帮助。如有错误或不足之处，请不吝赐教。
目录
用这个。$set()添加数据并更新视图描述。简单说一下vue.set()(这个的用法。$set)
使用this.$set()新增数据，更新视图
描述
如果在实例创建后向其添加了新属性，则不会触发视图更新。
简单的讲就是
页面呈现完成后，将不会监视向数据中的数组或对象添加或删除属性，并且不会更新视图。
div id=应用程序
El-button @click=setinfo 新属性/el-button
div v-for= item in info { { item } }/div
/div
数据：{
信息：{
id: 1，
姓名：老王，
}
},
setinfo() {
让那个=这个
that.info.age=11
console.log(that.info)
},
您可以看到，单击按钮后，打印的数据中有年龄，但视图没有更新。
正确的做法是用这个。$set
setinfo() {
让那个=这个
那个。$set(that.info， age ， 11 )
console.log(that.info)
}
this.$set(target, key, value)
Target:要改变的数据源(可以是对象，也可以是数组)key:要改变的具体数据(索引)value: this。$delete(target，key)可以用于新增的值删除属性。
这个。$delete(that.info， name )
说说vue.set() (this.$set)用法
这段时间工作中经常操作数组数据，需要实时更新视图数据。这时候首先想到的就是vue.set()方法(注意：当发现模型上的数据有变化，但是页面上的视图数据没有变化时，建议使用这种方法)。这个方法的使用首先要在页面中引入vue，应该这样写：从‘vue’中导入Vue，这样就可以在组件中全局获取Vue的实例对象。
如果觉得介绍起来麻烦，建议用别名this。vue.set的$set
那么现在上代码：
HTML:
ul class=省_区_样式省_区
li v-for=(item，index)in province arrs :key= index :id= index input type= checkbox :id= checkbox index :class= { check on:item . check on，check off:item . check off } @ click= click province(index，item) label:for= checkbox index { item . name } }/labeli @ click= clickProvince icon(index，item)/i/li
/ul
JS:
clickProvince(pindex，pitem) {
pitem.checkOn=！pitem.checkOn
pitem.checkOff=！pitem.checkOff
这个。$set(this.provinceArrs，pindex，{p_name: pitem.p_name，p: pitem.p，name: pitem.name，c: pitem.c，checkOn: pitem.checkOn，checkOff: pitem.checkOff})
}
从上面的代码可以看出，点击事件clickProvince()可以改变数组this.provinceArrs中指定下标pindex的值，实时更新页面的视图，从而大大方便了数组中某个值的操作。使用此处显示的列：$ set (arr，index，val)。
当然，这个。除了数组之外，$set还可以用来操作对象。使用示例：这个。$set( obj，key，val)。
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。