vue 后台返回的一维数组怎样变成二维数组

最新推荐文章于 2024-09-17 20:08:34 发布

白开水z

最新推荐文章于 2024-09-17 20:08:34 发布

阅读量2.3k

点赞数 1

分类专栏： vue elemnent 二维数组文章标签： vue js vue.js

本文链接：https://blog.csdn.net/li222248/article/details/115278023

版权

vue 同时被 3 个专栏收录

13 篇文章 0 订阅

订阅专栏

elemnent

5 篇文章 0 订阅

订阅专栏

二维数组

1 篇文章 0 订阅

订阅专栏

放一下效果图

![在这里插入图片描述](https://img-blog.csdnimg.cn/20210328112403383.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpMjIyMjQ4,size_16,color_FFFFFF,t_70

实现代码

 //重新封装成二维数组
    var list = res.data.records //获取后台数据 这个不多赘述
    let groups = []
    let Data = []
    list.map((v, i) => {//遍历后台返回的一维数组
      groups.push({//提取所需字段重新封装成groups数组
        name: v.name,
      })
      Data.push({//提取所需字段重新封装成Data数组
        deliveryChargeMode: v.deliveryChargeMode,
        id: v.id,
      })
    })
    for (let i = 0; i < groups.length; i++) {//遍历groups
      groups[i]['tableData'] = new Array() //在groups数组里每个对象都追加一个名为tableData的空数组
    }
    for (let j = 0; j < Data.length; j++) {//遍历Data数组
      groups[j]['tableData'].push(Data[j])  //把Data数组里的下标数据对应放到groups下标对应的tableData数组里 如：groups[0]['tableData'] = Data[0]，groups[1]['tableData'] = Data[1]
    }
    console.log('list', list)
    console.log('arr', groups)