iview中如何让数组按列显示

在 iView 组件库中，如果你想让数组按照列显示，可以使用 `ivu-table` 组件。`ivu-table` 提供了丰富的表头、数据展示以及排序、分页等功能。以下是基本步骤：

1. 首先，安装并引入所需的组件库：

   <script src="https://unpkg.com/iview/dist/iview.min.js"></script>

2. 创建一个表格结构，并设置列定义（column definitions）：

   <template>
     <div>
       <table :data="data" border :columns="columns">
         <!-- 使用 slot 插入行数据 -->
         <tr v-for="(item, index) in data">
           <td v-for="(column, columnIndex) in columns" :key="index + '-' + columnIndex">{{ item[columnIndex] }}</td>
         </tr>
       </table>
     </div>
   </template>

3. 定义 `columns` 数组，包括字段名和格式选项（如标题、宽度等）：

   export default {
     data() {
       return {
         data: [
           // 你的数据数组
         ],
         columns: [
           { field: 'col1', title: '列1标题', key: 'col1' },
           { field: 'col2', title: '列2标题', key: 'col2' },
           { field: 'col3', title: '列3标题', key: 'col3' }, // ...添加所有列
         ]
       };
     }
   };

4. 如果需要动态配置列，可以在 `mounted()` 或者其他适当生命周期钩子里更新 `columns`。

注意：以上示例假设你已经有了一个 `data` 数组，其中每个元素都有对应的列属性（例如 `col1`, `col2`, `col3` 等）。你可以根据实际的数据结构调整列配置。