333 字
2 分钟
js 合并两个二维数组成为数组对象

本文同步自 CSDN · 清阿哥,原文发布于 2022-01-23。

使用场景#

在使用element-ui的级联选择器展示省市区(多选),后端需要传递数组对象格式里面包含每个选中的省市区的name和code数据.但是只能直接取到选中的code,可以使用ref来拿到级联选择器的getCheckedNodes方法来获取当前选中的省市区name;
最终将两个二维数组合成一个数组对象的格式传给后端,数据结构以及代码如下:

模板代码#
<el-cascader
ref="serveArea"
v-model="form.installServiceArea"
:options="regionData"
:props="areaProps"
clearable
placeholder="请选择服务区域"
>
js 代码#
handleParams() {
...
const { installServiceArea } = this.mainDetail;
// 服务区域
if (installServiceArea.length) {
// 服务区域的 name
let serveAreaName = this.$refs.baseInfo.$refs.serveArea.getCheckedNodes();
console.log(serveAreaName);
// 将服务区域处理成数组对象的数据格式
let serveAreaName = serveAreaName.map((i) => {
return {
provinceName: i.pathLabels[0],
cityName: i.pathLabels[1],
regionName: i.pathLabels[2],
};
});
console.log(serveAreaName, 'serveAreaName');
// 将服务区域的name和code合并成一个数组对象
let serveAreaParams = serveAreaName.map((i, ind) => {
return {
...i,
provinceCode: installServiceArea[ind][0],
cityCode: installServiceArea[ind][1],
regionCode: installServiceArea[ind][2],
};
});
console.log(serveAreaParams, 'serveAreaParams');
}
}

打印结果如下图:
原始数据是这样的
在这里插入图片描述
在这里插入图片描述

不积跬步,无以至千里;不积小流,无以成江海。
有问题可以留言一起交流讨论~

js 合并两个二维数组成为数组对象
https://qingge-cabana.vercel.app/posts/js-合并两个二维数组成为数组对象-122655104/
作者
清阿哥
发布于
2022-01-23
许可协议
CC BY-NC-SA 4.0

评论 待开启

评论基于 GitHub Discussions(Giscus)。仓库推送并开启 Discussions 后,在 giscus.app 获取 repoId / categoryId ,填入 src/config.tsgiscusConfig 即可。

  • 目标仓库: HHQ-666/qingge-blog
  • 详细步骤见项目 docs/DEPLOY.md 第二节