elementui中表格和分页，多选之后，在切换分页时能回显之前选择的数据

在Element UI的表格和分页组件中，当切换分页时不能自动回显之前选择的数据。这是因为分页是通过重新请求数据并渲染表格来实现的，切换分页时会更新表格的数据源。

要实现在切换分页时回显之前选择的数据，可以使用以下方法：

1. 使用状态管理工具（如Vuex）来保存选择的数据，在切换分页时从状态中获取之前选择的数据并重新选中。

2. 在每次选择数据时，将选中的数据保存到一个数组中，并记录选中的行号（可以使用row-key属性来标识每一行的唯一值）。然后在切换分页时，通过比对当前页的数据和选中的行号数组，将匹配到的行重新选中。

以下是具体的步骤：

Step 1: 在Vue组件的data中定义一个数组来存储选中的行号：

data() {
  return {
    selectedRows: [] // 存储选中的行号
  }
},

Step 2: 在表格的@selection-change事件中，更新选中的行号数组：

<el-table :data="tableData" @selection-change="handleSelectionChange">

methods: {
  handleSelectionChange(selection) {
    this.selectedRows = selection.map(row => row.id) // 假设id字段是唯一的行标识
  }
}

Step 3: 在分页组件的@current-change事件中，根据选中的行号重新选中行：

<el-pagination
  v-model="currentPage"
  :total="total"
  @current-change="handleCurrentChange">

methods: {
  handleCurrentChange(currentPage) {
    // 根据当前页的数据和选中的行号，重新选中行
    const start = (currentPage - 1) * this.pageSize
    const end = start + this.pageSize
    const currentPageData = this.tableData.slice(start, end)

    this.$nextTick(() => {
      this.$refs.table.clearSelection()
      currentPageData.forEach(row => {
        if (this.selectedRows.includes(row.id)) {
          this.$refs.table.toggleRowSelection(row, true)
        }
      })
    })
  }
}

上述代码中，handleSelectionChange方法会在表格的选择状态发生改变时被调用，更新selectedRows数组。而handleCurrentChange方法会在分页组件的页码变化时被调用，在重新渲染表格后，根据selectedRows数组重新选中行。

请注意，上述代码中使用了$refs.table来获取表格实例。如果你的表格组件没有设置ref属性，需要在.vue文件中给表格设置ref属性来引用它。