vue2 element table

Vue2 和 Element UI 都是非常流行的前端框架，可以用来快速构建漂亮的用户界面。Element UI 中提供了一个 Table 组件，可以用来展示数据，实现排序、筛选、分页等功能。

在 Vue2 中，使用 Element UI 的 Table 组件需要进行如下步骤：

1. 安装 Element UI 库，可以通过 npm 或者 CDN 方式引入。
2. 在 Vue 组件中引入 Element UI 的 Table 组件，并注册为本地组件。
3. 在组件中定义表格的数据和表头，通过 v-for 指令渲染出表格内容。
4. 配置 Table 组件的属性，包括表头、列的宽度、排序、筛选等功能。
5. 最后，将 Table 组件添加到页面中即可。

以下是一个简单的示例代码：

<template>
  <div>
    <el-table :data="tableData">
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="age" label="年龄"></el-table-column>
      <el-table-column prop="address" label="地址"></el-table-column>
    </el-table>
  </div>
</template>

<script>
import { Table, TableColumn } from 'element-ui';

export default {
  name: 'MyTable',
  components: {
    'el-table': Table,
    'el-table-column': TableColumn,
  },
  data() {
    return {
      tableData: [
        { name: '张三', age: 18, address: '北京市' },
        { name: '李四', age: 22, address: '上海市' },
        { name: '王五', age: 28, address: '广州市' },
      ],
    };
  },
};
</script>

需要注意的是，以上代码只是一个简单的示例，实际应用中还需要根据具体需求进行配置和优化。