vue el-table

Vue 的 el-table 是一个基于 Element UI 的表格组件，可以用于展示数据、分页、排序、筛选等功能。你可以通过配置 el-table 的列属性来定义表格的表头和内容，同时也可以通过 slot 来自定义表格的样式和功能。以下是一个简单的 el-table 的示例代码：

<template>
  <el-table :data="tableData">
    <el-table-column prop="date" label="日期"></el-table-column>
    <el-table-column prop="name" label="姓名"></el-table-column>
    <el-table-column prop="address" label="地址"></el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { date: '2021-01-01', name: '张三', address: '北京市' },
        { date: '2021-01-02', name: '李四', address: '上海市' },
        { date: '2021-01-03', name: '王五', address: '广州市' },
        { date: '2021-01-04', name: '赵六', address: '深圳市' }
      ]
    };
  }
};
</script>

在上面的代码中，我们将 el-table 的 data 属性绑定到一个数组 tableData 上，然后定义了三个 el-table-column，分别对应了 tableData 中的三个属性。通过 prop 属性，我们告诉 el-table-column 每个列对应的数据属性名，然后通过 label 属性定义了表头的名称。最后，我们将三个 el-table-column 放置在 el-table 中，即可渲染出一个包含三列的表格。