el-table全选 复选框+分页

`el-table` 是 Element UI 中的一个表格组件，它提供了一种方便的方式来展示数据，并支持多种交互功能，包括全选操作和分页。当你需要让用户同时选择多行数据，并且数据量较大需要分页浏览时，可以这样做：

1. **启用全选复选框**: 首先，在 `<el-table>` 的列定义中添加 `type="selection"` 属性，这会添加一个全局复选框到表格头部，用户可以点击这个复选框来快速选择所有行。

<el-table :data="tableData" :header-cell-style="{ padding: '0 50px'}">
  <el-table-column type="selection"></el-table-column>
</el-table>

2. **处理全选事件**: 使用 `@select` 或 `@selection-change` 事件监听用户的全选操作。当用户点击全局复选框时，你可以遍历数据并控制每个条目的选中状态。

<template>
  ...
</template>

<script>
export default {
  methods: {
    handleSelectAll(select) {
      this.tableData.forEach(row => row.selected = select);
    }
  },
  ...
}
</script>

3. **分页功能**: 如果数据量很大，可以配合 `el-pagination` 组件实现分页显示。设置好每页显示的数据量以及分页选项，然后通过索引来过滤当前页的数据。

<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
  :total="totalCount" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper">
</el-pagination>

记得在方法里处理 `handleSizeChange` 和 `handleCurrentChange` 来调整表格数据范围。