Vue.set()动态的新增与修改数据,触发视图更新的方法


Posted in Javascript onSeptember 15, 2018

参数:

Vue.set()动态的新增与修改数据,触发视图更新的方法

target:要更改的数据源(可以是对象或者数组)

key:要更改的具体数据(可以是字符串和数字)

value :重新赋的值

用法:向响应式对象中添加一个属性,并确保这个新属性同样是响应式的,且触发视图更新。

例:

data:{
   namelist:[
     {message:"叶落森",id:"1"},
     {message:"姜艳霞",id:"2"},
     {message:"姜小帅",id:"3"}
   ]
},
Vue.set(this.namelist,1,{message:"yeluosen",id:"1"})

注:Vue.set()在methods中也可以写成this.$set()

Vue.set()不光能修改数据,还能添加数据

data:{
   items:[
     {message:"Test one",id:"1"},
     {message:"Test two",id:"2"},
     {message:"Test three",id:"3"}
   ]
},
var itemLen=this.items.length;
Vue.set(this.items,itemLen,{message:"Test add attr",id:itemLen});

以上这篇Vue.set()动态的新增与修改数据,触发视图更新的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript继承的六大模式小结
Apr 13 Javascript
JS实现跟随鼠标立体翻转图片的方法
May 04 Javascript
jQuery实现多级下拉菜单jDropMenu的方法
Aug 28 Javascript
jQuery ajaxSubmit 实现ajax提交表单局部刷新
Jul 04 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
Jul 06 Javascript
AngularJS过滤器详解及示例代码
Aug 16 Javascript
JavaScript引用类型之基本包装类型实例分析【Boolean、Number和String】
Aug 09 Javascript
详解Ant Design of React的安装和使用方法
Dec 27 Javascript
JS实现打字游戏
Dec 17 Javascript
JavaScript数组去重实现方法小结
Jan 17 Javascript
js实现贪吃蛇小游戏(加墙)
Jul 31 Javascript
在elementui中Notification组件添加点击事件实例
Nov 11 Javascript
解决VUE中document.body.scrollTop为0的问题
Sep 15 #Javascript
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
Sep 15 #Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
Sep 15 #Javascript
vue--点击当前增加class,其他删除class的方法
Sep 15 #Javascript
vue-cli 使用vue-bus来全局控制的实例讲解
Sep 15 #Javascript
在vue中实现点击选择框阻止弹出层消失的方法
Sep 15 #Javascript
对vue下点击事件传参和不传参的区别详解
Sep 15 #Javascript
You might like
PHP中的float类型使用说明
2010/07/27 PHP
php递归创建和删除文件夹的代码小结
2012/04/13 PHP
Symfony2之session与cookie用法小结
2016/03/18 PHP
PHP判断是否是微信打开,浏览器打开的方法
2018/03/14 PHP
bgsound 背景音乐 的一些常用方法及特殊用法小结
2010/05/11 Javascript
基于jquery的滚动鼠标放大缩小图片效果
2011/10/27 Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
2013/07/16 Javascript
Js nodeType 属性全面解析
2013/11/14 Javascript
JavaScript模拟文件拖选框样式v1.0的实例
2017/08/04 Javascript
浅谈react性能优化的方法
2018/09/05 Javascript
vue中使用[provide/inject]实现页面reload的方法
2019/09/30 Javascript
Vue如何获取数据列表展示
2019/12/11 Javascript
JS实现网页端猜数字小游戏
2020/03/06 Javascript
Python Socket编程入门教程
2014/07/11 Python
Python实现抓取城市的PM2.5浓度和排名
2015/03/19 Python
Python中import导入上一级目录模块及循环import问题的解决
2016/06/04 Python
matplotlib savefig 保存图片大小的实例
2018/05/24 Python
Python3实现爬虫爬取赶集网列表功能【基于request和BeautifulSoup模块】
2018/12/05 Python
django处理select下拉表单实例(从model到前端到post到form)
2020/03/13 Python
Python接口测试文件上传实例解析
2020/05/22 Python
浅谈keras使用中val_acc和acc值不同步的思考
2020/06/18 Python
Python爬虫代理池搭建的方法步骤
2020/09/28 Python
CSS3实现自定义Checkbox特效实例代码
2017/04/24 HTML / CSS
关爱留守儿童倡议书
2014/04/15 职场文书
小学班干部竞选演讲稿
2014/04/24 职场文书
班主任评语大全
2014/04/26 职场文书
信访工作经验交流材料
2014/05/23 职场文书
环保标语大全
2014/06/12 职场文书
2015年公司新年寄语
2014/12/08 职场文书
仓库保管员岗位职责
2015/02/09 职场文书
2015年监理工作总结范文
2015/04/07 职场文书
2015年大学生党员承诺书
2015/04/27 职场文书
奖学金申请个人主要事迹材料
2015/11/04 职场文书
观看《筑梦中国》纪录片心得体会
2016/01/18 职场文书
Python基础之教你怎么在M1系统上使用pandas
2021/05/08 Python
Linux、ubuntu系统下查看显卡型号、显卡信息详解
2022/04/07 Servers