elementuiplus的多选表格 回显以及分页保存之前选择

在Element Plus中使用多选表格时，可以通过v-model双向绑定数据来实现回显以及分页保存之前的选择。以下是一个简单的例子：

<template>
  <el-table
    :data="tableData"
    v-model:selection="selectedRows"
    @selection-change="handleSelectionChange"
  >
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <el-table-column
      prop="date"
      label="日期"
      width="180">
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script setup>
import { ref } from 'vue';
 
const tableData = ref([
  // 初始数据，可以是从服务器获取的分页数据
]);
 
const selectedRows = ref([]); // 存储选中的行
 
// 当选中项变化时触发
function handleSelectionChange(val) {
  selectedRows.value = val;
}
</script>

在这个例子中，tableData是表格的数据源，selectedRows.value存储了当前选中的行。当用户在分页中切换页面时，你需要从服务器获取对应页面的数据，并使用该数据更新tableData。在切换页面时，你可以将selectedRows.value存储的选择保存下来，并在获取新的页面数据后，再进行回显。

请注意，Element Plus的多选表格组件可能没有直接的v-model:selection功能，你可能需要自行实现这部分逻辑，比如在tableData中追踪哪些行是选中的，并在handleSelectionChange中更新这个状态。