ELEMENT-PLUS的表格组件高级用法

1. 表格列的自定义渲染

可以通过设置 slots 属性来自定义表格列的渲染方式，例如：

2. 表格的行样式定制

可以通过设置 row-class-name 属性来自定义表格行的样式，例如：

.rowStyle {
  background-color: #f5f5f5;
}

3. 表格的分页定制

可以通过设置 pagination 属性来自定义表格的分页方式，例如：

data() {
  return {
    paginationConfig: {
      layout: "total, sizes, prev, pager, next, jumper",
      total: 100,
      pageSizes: [10, 20, 30, 50]
    }
  };
}

4. 表格的自定义筛选

可以通过设置 filter-method 属性来自定义表格的筛选功能，例如：

methods: {
  handleFilter(value, row, column) {
    const property = column.property;
    return row[property] === value;
  }
}

5. 表格的数据导出

可以使用 Element-Plus 提供的 Export2Excel 方法来实现表格数据的导出，例如：

import { export_json_to_excel } from "@/utils/export2Excel";

exportExcel() {
  const tHeader = ["姓名", "年龄", "性别"];
  const filterVal = ["name", "age", "gender"];
  const list = this.tableData;
  const data = https://www.yisu.com/ask/this.formatJson(filterVal, list);"表格数据");
}