el-table多选分页时，记住上一页下一页-勾选数据

您好，如果您想在el-table多选分页时记住上一页下一页的勾选数据，可以使用以下步骤：

1. 在el-table的定义中，添加一个v-model属性，将其绑定到一个数组中，用于存储用户所选的数据。

2. 在el-table的定义中，添加一个@select事件监听器，每当用户选择或取消选择某一行时，将该行的数据添加或从数组中删除。

3. 在分页器中，添加一个@current-change事件监听器，每当用户切换页码时，将当前页的已选数据保存到一个临时数组中。

4. 在分页器中，添加一个@size-change事件监听器，每当用户切换每页显示的行数时，将已选数据的数组清空。

5. 在分页器中，添加一个@next-click事件监听器，每当用户点击下一页按钮时，将当前页的已选数据保存到一个临时数组中。

6. 在分页器中，添加一个@prev-click事件监听器，每当用户点击上一页按钮时，将当前页的已选数据保存到一个临时数组中。

7. 在分页器中，添加一个@current-change事件监听器，每当用户切换页码时，将上一页和下一页的已选数据合并到已选数据的数组中。

通过以上步骤，您可以在el-table多选分页时，记住上一页下一页的勾选数据。请注意，这只是一种实现方式，您可以根据自己的需求进行调整。

相关问题

element table多选只能选中当前页数据_element-ui里的el-table 前端分页

在 Element UI 的 el-table 中，多选只能选中当前页数据的实现方式如下：

1. 在 el-table 中添加一个多选列：

<el-table-column type="selection" width="55"></el-table-column>

2. 定义一个数组用来保存选中的数据：

selectedRows: []

3. 添加一个事件监听器，当用户勾选多选列时，将当前页的选中数据保存到数组中：

handleSelectionChange(selection) {
  this.selectedRows = selection
}

4. 在 el-pagination 组件中添加一个事件监听器，当用户切换分页时，清空选中数据数组：

handleCurrentChange() {
  this.selectedRows = []
}

完整代码示例：

<template>
  <div>
    <el-table :data="tableData" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column prop="name" label="Name"></el-table-column>
      <el-table-column prop="age" label="Age"></el-table-column>
    </el-table>
    <el-pagination
      :current-page="currentPage"
      :page-size="pageSize"
      :total="total"
      @current-change="handleCurrentChange"
    ></el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      selectedRows: [],
      currentPage: 1,
      pageSize: 10,
      total: 100
    }
  },
  methods: {
    handleSelectionChange(selection) {
      this.selectedRows = selection
    },
    handleCurrentChange() {
      this.selectedRows = []
    }
  }
}
</script>

el-table没加勾选框勾选框出现

在Vue的Element UI库中，`el-table`组件默认并不包含勾选框。如果你想在表格中添加勾选框功能，你可以通过自定义列（custom column）来实现。以下是一个简单的步骤：

1. 首先，在表头（header row）中添加一个单元格（cell），并设置其内容为你想要的复选框元素。可以使用HTML `<template>` 结构来插入这个元素。

<template slot="header" slot-scope="scope">
  <el-checkbox v-model="tableCheckboxAll" @change="handleCheckChange"></el-checkbox>
</template>

2. 定义数据属性 `tableCheckboxAll` 来控制所有行的选中状态，并提供事件处理器 `handleCheckChange` 来处理勾选状态变化。

export default {
  data() {
    return {
      tableCheckboxAll: false,
    };
  },
  methods: {
    handleCheckChange(value) {
      this.$refs.table.toggleRowSelection(this.data, value);
    },
  },
}

3. 在表格的 `ref` 属性上绑定 "table"，以便后续操作表格的选择。

<el-table :data="data" ref="table">
...
</el-table>

4. 如果需要允许单行或多行选择，记得在`data`数组里每个对象也维护一个表示是否被选中的字段，比如`selected`。

以上就是基本的勾选框添加方法，如果你还有其他特殊需求，比如动态增减勾选列、分页等，可能还需要额外处理。