element ui表格案例

Element UI是一个流行的开源UI组件库，它为Vue.js应用程序提供了丰富的表格组件，使得数据展示和管理变得更加直观和易用。下面是一个简单的Element UI表格案例：

<template>
  <el-table :data="tableData" border style="width: 100%">
    <el-table-column prop="date" label="日期" width="180">
    </el-table-column>
    <el-table-column prop="name" label="姓名" width="180">
    </el-table-column>
    <el-table-column prop="address" label="地址">
    </el-table-column>
    <el-table-column prop="zip" label="邮编" width="120">
    </el-table-column>
    <el-table-column prop="phone" label="电话" width="120">
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          date: '2022-01-01',
          name: '张三',
          address: '上海市松江区人民大道1号',
          zip: '205200',
          phone: '13800138000'
        },
        // 添加更多的数据行...
      ]
    };
  }
};
</script>

在这个例子中，我们创建了一个表格，列定义了日期、姓名、地址、邮编和电话，数据来自`tableData`数组。你可以根据实际需求调整列的数量、内容以及样式。