vue更改数组中的值实例代码详解


Posted in Javascript onFebruary 07, 2020

根据下标更改时

vm为新建的vue对象

ind为数组

第一个e为在数组ind中e索引位置

第二个e为更改为值e

vm.$set(vm.ind,e,e)

常规更改

arr为数组

//添加
arr.push(1);
//删除
arr.splice(*,*);
//替换
arr.splice(*,*,*);

splice方法

实例

例子 1

在本例中,我们将创建一个新数组,并向其添加一个元素:

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,0,"William")
document.write(arr + "<br />")
</script>

输出:

George,John,Thomas,James,Adrew,Martin
George,John,William,Thomas,James,Adrew,Martin

例子 2

在本例中我们将删除位于 index 2 的元素,并添加一个新元素来替代被删除的元素:

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,1,"William")
document.write(arr)
</script>

输出:

George,John,Thomas,James,Adrew,Martin
George,John,William,James,Adrew,Martin

例子 3

在本例中我们将删除从 index 2 ("Thomas") 开始的三个元素,并添加一个新元素 ("William") 来替代被删除的元素:

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,3,"William")
document.write(arr)
</script>

输出:

George,John,Thomas,James,Adrew,Martin
George,John,William,Martin

总结

以上所述是小编给大家介绍的vue更改数组中的值实例代码详解,希望对大家有所帮助!

Javascript 相关文章推荐
基于jQuery的360图片展示实现代码
Jun 14 Javascript
Jquery网页内滑动缓冲导航的实现代码
Apr 05 Javascript
在 Express 中使用模板引擎
Dec 10 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
JS中静态页面实现微信分享功能
Feb 06 Javascript
使用gulp搭建本地服务器并实现模拟ajax
Apr 05 Javascript
canvas+gif.js打造自己的数字雨头像的示例代码
Oct 26 Javascript
从vue源码解析Vue.set()和this.$set()
Aug 30 Javascript
vue使用keep-alive保持滚动条位置的实现方法
Apr 09 Javascript
js获取浏览器地址(获取第1个斜杠后的内容)
Sep 03 Javascript
layui-select动态选中值的例子
Sep 23 Javascript
微信小程序实现星星评分效果
Nov 01 Javascript
Vue 一键清空表单的实现方法
Feb 07 #Javascript
Vue中qs插件的使用详解
Feb 07 #Javascript
npm qs模块使用详解
Feb 07 #Javascript
Js参数RSA加密传输之jsencrypt.js的使用
Feb 07 #Javascript
Vue使用JSEncrypt实现rsa加密及挂载方法
Feb 07 #Javascript
jQuery实现获取多选框的值示例
Feb 07 #jQuery
微信小程序canvas开发水果老虎机的思路详解
Feb 07 #Javascript
You might like
德生PL990,目前市面上唯一一款便携式插卡蓝牙全波段高性能收音机
2021/03/02 无线电
eAccelerator的安装与使用详解
2013/06/13 PHP
如何使用jQuery+PHP+MySQL来实现一个在线测试项目
2015/04/26 PHP
PHP基于yii框架实现生成ICO图标
2015/11/13 PHP
JS弹出对话框返回值代码(asp.net后台)
2010/12/28 Javascript
Jquery Ajax xmlhttp请求成功问题
2015/02/04 Javascript
javascript实现详细时间提醒信息效果的方法
2015/03/11 Javascript
JavaScript中的slice()方法使用详解
2015/06/06 Javascript
Nodejs express框架一个工程中同时使用ejs模版和jade模版
2015/12/28 NodeJs
javascript中加var和不加var的区别 你真的懂吗
2016/01/06 Javascript
纯javascript前端实现base64图片下载(兼容IE10+)
2018/09/14 Javascript
关于JS解构的5种有趣用法
2019/09/05 Javascript
vue实现表单录入小案例
2019/09/27 Javascript
[51:15]完美世界DOTA2联赛PWL S2 PXG vs Magma 第一场 11.21
2020/11/24 DOTA
[03:02]2020完美世界城市挑战赛(秋季赛)总决赛回顾
2021/03/11 DOTA
Python 专题二 条件语句和循环语句的基础知识
2017/03/19 Python
利用Python批量压缩png方法实例(支持过滤个别文件与文件夹)
2017/07/30 Python
Python数据分析之获取双色球历史信息的方法示例
2018/02/03 Python
python中ASCII码和字符的转换方法
2018/07/09 Python
python将txt等文件中的数据读为numpy数组的方法
2018/12/22 Python
django ModelForm修改显示缩略图 imagefield类型的实例
2019/07/28 Python
PyCharm使用之配置SSH Interpreter的方法步骤
2019/12/26 Python
python 解决print数组/矩阵无法完整输出的问题
2020/02/19 Python
python实现横向拼接图片
2020/03/23 Python
详解CSS3的box-shadow属性制作边框阴影效果的方法
2016/05/10 HTML / CSS
html5 offlline 缓存使用示例
2013/06/24 HTML / CSS
Ray-Ban雷朋瑞典官方网站:全球领先的太阳眼镜品牌
2019/08/22 全球购物
重写子类方法时,抛出异常的书写注意事项
2015/10/17 面试题
大学生怎样进行自我评价
2013/12/07 职场文书
环境科学专业优秀毕业生自荐书
2014/02/03 职场文书
趣味体育活动方案
2014/02/08 职场文书
群众路线教育实践活动批评与自我批评
2014/09/15 职场文书
交通事故委托书范本(2篇)
2014/09/21 职场文书
Django操作cookie的实现
2021/05/26 Python
MySQL如何解决幻读问题
2021/08/07 MySQL
Centos7 Shell编程之正则表达式、文本处理工具详解
2022/08/05 Servers