二维数组转为拆分为多条一维数组，el-tABLE进行合并展示

可以使用JavaScript中的Array方法来实现二维数组转为多条一维数组的操作。具体实现方式如下：

//定义一个二维数组
var twoDimArray = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];

//将二维数组转为多条一维数组
var oneDimArray = [].concat.apply([], twoDimArray);

//通过el-TABLE进行合并展示
var elTableData = [];
for(var i = 0; i < oneDimArray.length; i++) {
  elTableData.push({
    id: i + 1,
    value: oneDimArray[i]
  });
}

其中，`[].concat.apply([], twoDimArray)`是将二维数组转为多条一维数组的核心代码，`elTableData`是用于存储合并后的数据，最后可以将`elTableData`作为参数传递给`el-table`组件进行展示。

相关问题

二维数组使用el-table展示

二维数组可以使用`el-table`组件进行展示，具体实现方式如下：

<template>
  <el-table :data="tableData">
    <el-table-column v-for="(item, index) in columnData" :key="index" :prop="'col' + index" :label="item"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      // 二维数组数据
      data: [
        [1, 2, 3],
        [4, 5, 6],
        [7, 8, 9]
      ],
      // 表格列名
      columnData: ['列一', '列二', '列三']
    };
  },
  computed: {
    // 将二维数组转为el-table需要的数据格式
    tableData() {
      let data = [];
      for(let i = 0; i < this.data.length; i++) {
        let row = {};
        for(let j = 0; j < this.data[i].length; j++) {
          row['col' + j] = this.data[i][j];
        }
        data.push(row);
      }
      return data;
    }
  }
};
</script>

在上述代码中，我们通过`el-table`组件展示二维数组数据，其中`tableData`是通过`computed`计算属性将二维数组转为`el-table`需要的数据格式，即一个包含多个对象的数组，每个对象的属性名代表一个列名，属性值代表对应列的值。在`<el-table-column>`标签中，我们使用`v-for`循环遍历`columnData`数组，动态生成表格的列，其中`:prop="'col' + index"`表示每个列的属性名为`col + index`，`:label="item"`表示每个列的名称为`item`。

二维对象数组，使用el-table展示

二维对象数组可以使用`el-table`组件进行展示，具体实现方式如下：

<template>
  <el-table :data="tableData">
    <el-table-column v-for="(item, index) in columnData" :key="index" :prop="item.key" :label="item.label"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      // 二维对象数组数据
      data: [
        {id: 1, name: '张三', age: 20},
        {id: 2, name: '李四', age: 30},
        {id: 3, name: '王五', age: 40}
      ],
      // 表格列名
      columnData: [
        {key: 'id', label: '编号'},
        {key: 'name', label: '姓名'},
        {key: 'age', label: '年龄'}
      ]
    };
  },
  computed: {
    // 将二维对象数组转为el-table需要的数据格式
    tableData() {
      return this.data;
    }
  }
};
</script>

在上述代码中，我们通过`el-table`组件展示二维对象数组数据，其中`tableData`就是二维对象数组数据，`columnData`是一个数组，包含每列的属性名和列名，其中`key`表示属性名，`label`表示列名。在`<el-table-column>`标签中，我们使用`v-for`循环遍历`columnData`数组，动态生成表格的列，其中`:prop="item.key"`表示每个列的属性名为`item.key`，`:label="item.label"`表示每个列的名称为`item.label`。