vue中splice的用法

简介: vue中splice的用法

splice(index,len,[item])它也可以用来替换/删除/添加数组内某一个或者几个值(该方法会改变原始数组)

index:数组开始下标      


len: 替换/删除的长度      


item:替换的值,删除操作的话 item为空


删除:

//删除起始下标为1,长度为1的一个值(len设置1,如果为0,则数组不变)

var arr = ['a','b','c','d'];

arr.splice(1,1);

console.log(arr);  

//['a','c','d'];



//删除起始下标为1,长度为2的一个值(len设置2)

var arr2 = ['a','b','c','d']

arr2.splice(1,2);

console.log(arr2);

//['a','d']


替换:

//替换起始下标为1,长度为1的一个值为‘ttt’,len设置的1

var arr = ['a','b','c','d'];

arr.splice(1,1,'ttt');

console.log(arr);        

//['a','ttt','c','d']


//替换起始下标为1,长度为2的两个值为‘ttt’,len设置的1

var arr2 = ['a','b','c','d'];

arr2.splice(1,2,'ttt');

console.log(arr2);      

//['a','ttt','d']


添加:

//在下标为1处添加一项'ttt'


var arr = ['a','b','c','d'];

arr.splice(1,0,'ttt');

console.log(arr);        

//['a','ttt','b','c','d']  


目录
相关文章
|
1天前
|
JavaScript 数据可视化
vue-cli学习一:vue脚手架的 vue-cli2和vue-cli3版本 创建vue项目,vue的初始化详解
这篇文章介绍了如何使用vue-cli 2和3版本来创建Vue项目,并详细说明了两者之间的主要区别。
15 5
vue-cli学习一:vue脚手架的 vue-cli2和vue-cli3版本 创建vue项目,vue的初始化详解
|
1天前
|
JavaScript 数据可视化
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置
这篇文章详细介绍了Vue CLI 3版本创建项目时的Runtime-Compiler和Runtime-only两种模式的区别、Vue程序的运行过程、render函数的使用、eslint的关闭方法,以及Vue CLI 2和3版本配置文件的不同和脚手架3版本创建项目的配置文件配置方法。
11 3
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置
|
1天前
|
数据可视化 JavaScript 前端开发
低代码可视化工具--vue条件判断v-if可视化设置-代码生成器
低代码可视化工具--vue条件判断v-if可视化设置-代码生成器
11 2
|
2天前
|
缓存 JavaScript UED
vue的动态组件 keep-alive
【10月更文挑战第6天】
12 3
|
1天前
|
JavaScript UED
Vue双向数据绑定的原理
【10月更文挑战第7天】
|
2天前
|
JSON 数据可视化 JavaScript
低代码可视化教你Vue遍历循环绑定
低代码可视化教你Vue遍历循环绑定
10 0
|
2天前
|
JavaScript 开发工具
低代码开发工具教你Vue双向数据绑定
低代码开发工具教你Vue双向数据绑定
8 0
|
4天前
|
JavaScript 开发者
|
4天前
|
前端开发 JavaScript 开发者
|
2天前
|
JavaScript
vue知识点
10月更文挑战第2天
17 3