一维数组变二维数组

​

  前言

当出现相同的参数 根据另一个特定参数来改变数据

改变原因  如下图 出现相同的名字但是版本号不同  下拉框数据是 版本号  改变版本号时候改变这一条数据 所以 一个大数组中分为每个对象  每个对象两个参数 第一个参数：  是选中的版本号 第二个参数是相同名字的数据组成一个对象 key是版本号 对应他的数据

 

 

 

一、上图的数据格式（改变后）

 

      　　 selectedIndex 字段是选中版本号

                versionData  字段包含两个对象 字段名为版本号 对应版本号的数据

                4 和 8 是版本号 对应的对象是数据

二、实现步骤

1.改变数据格式

 代码如下 

dataset_version是版本号（根据这个来改变数据的）， dataset_name为名字（数据中相同的）

     setData(response) { // 改变数组的格式 一维数组
            const data = JSON.parse(JSON.stringify(response));
            const resultArr = data.map(item => {
                return {
                    selectedIndex: item.dataset_version,
                    versionData: {
                        [item.dataset_version]: item
                    }
                };
            });
            return resultArr.reduce((pre, next) => {
                if (!pre.length) {
                    pre.push(next);
                    return pre;
                }
                const finderIndex = pre.findIndex(item => {
                    return Object.keys(item.versionData).some((itema) => {
                        return item.versionData[itema].dataset_name === next.versionData[next.selectedIndex].dataset_name;
                    });
                });
                if (~finderIndex) {
                    pre[finderIndex].versionData[next.selectedIndex] = next.versionData[next.selectedIndex];
                    return pre;
                }
                pre.push(next);
                return pre;
            }, []);
        },

 

 

2. 渲染数据

代码如下（示例）：

 <el-select v-if="item.label==='数据集版本'" v-model="scope.row[item.prop]" @change="tabelRowchange(scope.row, scope.$index)">
                        <el-option v-for="(optItem,opIndex) in Object.keys(tableDatas[scope.$index].versionData)" :key="opIndex" :value="optItem" :label="optItem"/>
                    </el-select>

 

 

​