vueelementui横向表格

Vue ElementUI提供了`el-table`组件，可以方便地实现横向表格。以下是一个简单的示例：

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="age" label="年龄"></el-table-column>
      <el-table-column prop="gender" label="性别"></el-table-column>
      <el-table-column prop="address" label="地址"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          name: '张三',
          age: 18,
          gender: '男',
          address: '北京市海淀区'
        },
        {
          name: '李四',
          age: 22,
          gender: '女',
          address: '上海市浦东新区'
        },
        {
          name: '王五',
          age: 30,
          gender: '男',
          address: '广州市天河区'
        }
      ]
    }
  }
}
</script>

在上面的示例中，我们使用`el-table`组件来生成横向表格，并通过`el-table-column`组件定义表头和列数据。其中，`prop`属性指定了要显示的数据字段，`label`属性定义了表头显示的文本。

除了基本的横向表格，Vue ElementUI还提供了许多其他功能，例如分页、排序、筛选等，您可以根据自己的需求进行配置和使用。