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实现照片散落桌子上,单击放大的LightBox效果
Nov 28 Javascript
javascript中cookie对象用法实例分析
Jan 30 Javascript
浅谈javascript中基本包装类型
Jun 03 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
May 15 Javascript
jQuery模拟完美实现经典FLASH导航动画效果【附demo源码下载】
Nov 09 Javascript
canvas 弹幕效果(实例分享)
Jan 11 Javascript
jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码
Mar 21 jQuery
vue-cli 3 全局过滤器的实例代码详解
Jun 03 Javascript
Vue 3.0 前瞻Vue Function API新特性体验
Aug 12 Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
Sep 20 Javascript
vue在图片上传的时候压缩图片
Nov 18 Vue.js
避坑之 JavaScript 中的toFixed()和正则表达式
Apr 19 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
php学习笔记 类的声明与对象实例化
2011/06/13 PHP
PHP获取音频文件的相关信息
2015/06/22 PHP
phpcms配置列表页以及获得文章发布时间
2017/07/04 PHP
PDO::rollBack讲解
2019/01/29 PHP
解决php extension 加载顺序问题
2019/08/16 PHP
多广告投放代码 推荐
2006/11/13 Javascript
JavaScript中将一个值转换为字符串的方法分析[译]
2012/09/21 Javascript
表单元素与非表单元素刷新区别详细解析
2013/11/06 Javascript
JS判断表单输入是否为空(示例代码)
2013/12/23 Javascript
jquery实现瀑布流效果分享
2014/03/26 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
2014/08/13 Javascript
Jquery $.getJSON 在IE下的缓存问题解决方法
2014/10/10 Javascript
每天一篇javascript学习小结(基础知识)
2015/11/10 Javascript
JavaScript电子时钟倒计时
2016/01/09 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
2016/06/03 Javascript
Select下拉框模糊查询功能实现代码
2016/07/22 Javascript
超全面的JavaScript开发规范(推荐)
2017/01/21 Javascript
javascript自执行函数
2017/02/10 Javascript
jq stop()和:is(:animated)的用法及区别(详解)
2017/02/12 Javascript
JS中min函数实例讲解
2019/02/18 Javascript
如何使用CSS3+JQuery实现悬浮墙式菜单
2019/06/18 jQuery
Python3.5编程实现修改IIS WEB.CONFIG的方法示例
2017/08/18 Python
浅谈python 读excel数值为浮点型的问题
2018/12/25 Python
CSS3的 fit-content实现水平居中
2017/09/07 HTML / CSS
html5中监听canvas内部元素点击事件的三种方法
2019/04/28 HTML / CSS
详解移动端html5页面长按实现高亮全选文本内容的兼容解决方案
2016/12/03 HTML / CSS
实习医生自我评价
2013/09/22 职场文书
商务英语求职自荐信范文
2013/12/24 职场文书
职工运动会邀请函
2014/01/19 职场文书
信息总监管理职责范本
2014/03/08 职场文书
班级口号大全
2014/06/09 职场文书
科技工作者先进事迹
2014/08/16 职场文书
2015小学教师年度工作总结
2015/05/12 职场文书
结婚主持人致辞
2015/07/28 职场文书
演讲稿:​快乐,从不抱怨开始!
2019/04/02 职场文书
动画电影《擅长捉弄人的高木同学》6月10日上映!
2022/03/20 日漫