Vue中foreach数组与js中遍历数组的写法说明
更新时间:2021年06月04日 16:23:26 作者:霸道流氓
这篇文章主要介绍了Vue中foreach数组与js中遍历数组的写法说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
Vue foreach数组与js中遍历数组的写法
场景
Vue中使用Axios发送get或者post请求,发送请求时需要在js中
对请求参数进行遍历并处理。
接收响应时需要对响应结果进行遍历和处理。
注意区分在vue和js中foreach数组的区别。
实现
在js中遍历数组
//定义班次详细数组
var bcglxiangxiList = new Array();
//定义班次详细对象
var bcxiangxi = {};
//循环传递的参数
bcglXiangXiListParam.forEach(element => {
bcxiangxi.xh = element.xh;
bcxiangxi.bcbh = data.bcbh;
bcxiangxi.dkkssj = element.sjfw[0];
bcxiangxi.dkjssj = element.sjfw[1];
bcxiangxi.ts = element.ts;
bcxiangxi.dkdd = element.dkdd;
bcxiangxi.zxjxljsj = element.jxsjfw[0];
bcxiangxi.zdjxljsj = element.jxsjfw[1];
//将班次详细对象存进班次详细数组
bcglxiangxiList.push(bcxiangxi);
});
在vue中遍历数组
var bcglxiangxiList = new Array();
var bcxiangxi = {};
debugger;
if (
response.data.bcglXiangXiList != null &&
response.data.bcglXiangXiList.length > 0
) {
console.log(response.data.bcglXiangXiList);
response.data.bcglXiangXiList.forEach((item, index) => {
console.log(item);
bcxiangxi.xh = item.xh;
bcxiangxi.bcbh = item.bcbh;
//debugger
bcxiangxi.sjfw = new Array();
bcxiangxi.sjfw[0] = item.dkkssj;
bcxiangxi.sjfw[1] = item.dkjssj;
bcxiangxi.ts = item.ts;
bcxiangxi.dkdd = item.dkdd;
bcxiangxi.jxsjfw = new Array();
bcxiangxi.jxsjfw[0] = item.zxjxljsj;
bcxiangxi.jxsjfw[1] = item.zdjxljsj;
bcglxiangxiList.push(bcxiangxi);
});
}
可以看到遍历的方式是一样的,在js中一样可以用两个参数的遍历方式
//定义班次详细数组
var bcglxiangxiList = new Array();
//定义班次详细对象
var bcxiangxi = {};
//循环传递的参数
bcglXiangXiListParam.forEach((element,index) => {
bcxiangxi.xh = element.xh;
bcxiangxi.bcbh = data.bcbh;
bcxiangxi.dkkssj = element.sjfw[0];
bcxiangxi.dkjssj = element.sjfw[1];
bcxiangxi.ts = element.ts;
bcxiangxi.dkdd = element.dkdd;
bcxiangxi.zxjxljsj = element.jxsjfw[0];
bcxiangxi.zdjxljsj = element.jxsjfw[1];
//将班次详细对象存进班次详细数组
bcglxiangxiList.push(bcxiangxi);
});
vue forEach循环使用
//data为集合
data.forEach(function(item, index) {
//item 就是当日按循环到的对象
//index是循环的索引,从0开始
})
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
element ui table(表格)实现点击一行展开功能
这篇文章主要给大家介绍了关于element ui table(表格)实现点击一行展开功能的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2018-12-12
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
这篇文章主要介绍了vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
vue3.0 router路由跳转传参问题(router.push)
这篇文章主要介绍了vue3.0 router路由跳转传参问题(router.push),具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教2023-02-02
Vue3中SetUp函数的参数props、context详解
我们知道setup函数是组合API的核心入口函数,下面这篇文章主要给大家介绍了关于Vue3中SetUp函数的参数props、context的相关资料,需要的朋友可以参考下2021-07-07
vue配置electron使用electron-builder进行打包的操作方法
这篇文章主要介绍了vue配置electron使用electron-builder进行打包的操作方法,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧2024-08-08


最新评论