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 相关文章推荐
IE中jscript/javascript的条件编译
Sep 07 Javascript
JavaScript简单实现网页回到顶部功能
Nov 12 Javascript
js识别不同浏览器基于userAgent做判断
Jul 29 Javascript
javascript实现单击和双击并存的方法
Dec 13 Javascript
jquery中checkbox使用方法简单实例演示
Nov 24 Javascript
javascript实现起伏的水波背景效果
May 16 Javascript
原生js验证简洁注册登录页面
Dec 17 Javascript
Vue.js 插件开发详解
Mar 29 Javascript
微信小程序本地缓存数据增删改查实例详解
May 24 Javascript
深入理解vue-loader如何使用
Jun 06 Javascript
默认浏览器设置及vue自动打开页面的方法
Sep 21 Javascript
ES6使用新特性Proxy实现的数据绑定功能实例
May 11 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实现快钱支付功能(涉及到接口)
2013/07/01 PHP
PHP屏蔽关键字实现方法
2016/11/17 PHP
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
JavaScript性能陷阱小结(附实例说明)
2010/12/28 Javascript
jQuery源码分析-05异步队列 Deferred 使用介绍
2011/11/14 Javascript
基于JQuery的多标签实现代码
2012/09/19 Javascript
node.js中的fs.rename方法使用说明
2014/12/16 Javascript
JS制作简单的三级联动
2015/03/18 Javascript
jQuery选择器源码解读(二):select方法
2015/03/31 Javascript
js实现获取div坐标的方法
2015/11/16 Javascript
原生javascript实现的一个简单动画效果
2016/03/30 Javascript
javascript加减乘除的简单实例
2016/07/12 Javascript
对node.js中render和send的用法详解
2018/05/14 Javascript
微信小程序js文件改变参数并在视图上及时更新【推荐】
2018/06/11 Javascript
Array数组对象中的forEach、map、filter及reduce详析
2018/08/02 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
2018/08/09 Javascript
js canvas实现写字动画效果
2018/11/30 Javascript
axios+Vue实现上传文件显示进度功能
2019/04/14 Javascript
vue模仿网易云音乐的单页面应用
2019/04/24 Javascript
JS函数参数的传递与同名参数实例分析
2020/03/16 Javascript
[02:09]抵达西雅图!中国军团加油!
2014/07/07 DOTA
python共享引用(多个变量引用)示例代码
2013/12/04 Python
python matplotlib 注释文本箭头简单代码示例
2018/01/08 Python
Python 变量类型详解
2018/10/10 Python
python设置环境变量的作用整理
2020/02/17 Python
css3 border-image使用说明
2010/06/23 HTML / CSS
突袭HTML5之Javascript API扩展2—地理信息服务及地理位置API学习
2013/01/31 HTML / CSS
美国顶级奢侈茶:Mighty Leaf Tea(美泰茶)
2016/11/26 全球购物
会计实习生工作总结的自我评价
2013/10/07 职场文书
自我评价范文
2013/12/22 职场文书
业务部门经理岗位职责
2014/02/23 职场文书
一年级班主任感言
2014/03/08 职场文书
四风问题对照检查整改措施思想报告
2014/10/05 职场文书
给下属加薪申请报告
2015/05/15 职场文书
js实现自动锁屏功能
2021/06/02 Javascript
python中的getter与setter你了解吗
2022/03/24 Python