el-table实现跨页多选

<template>
  <div>
    <el-table
      :row-key="getRowKeys"
      @selection-change="handleChange"
      :data="displayedData"
      class="exporttable"
      style="width: 50%"
      border
    >
      <el-table-column :reserve-selection="true" type="selection"> </el-table-column>
      <el-table-column v-for="item in data1" :key="item" :prop="item" :label="item"> </el-table-column>
    </el-table>
    <el-pagination layout="prev, pager, next" @current-change="currentChange" :total="totalRows" :page-size="pageSize" />
  </div>
</template>

  data() {
    return {
      data: [
        {
          id: '1298712211',
          name: 'ddddd',
          amount1: '234',
          amount2: '3.2',
          amount3: 10,
        },
        {
          id: '12987122',
          name: 'Tom',
          amount1: '234',
          amount2: '3.2',
          amount3: 10,
        },
        {
          id: '12987123',
          name: 'Tom',
          amount1: '165',
          amount2: '4.43',
          amount3: 12,
        },
        {
          id: '12987124',
          name: 'jierui',
          amount1: '324',
          amount2: '1.9',
          amount3: 9,
        },
        {
          id: '12987125',
          name: 'Tom',
          amount1: '621',
          amount2: '2.2',
          amount3: 17,
        },
        {
          id: '12987126',
          name: 'Tom',
          amount1: '539',
          amount2: '4.1',
          amount3: 15,
        },
        {
          id: '12987127',
          name: 'Tom',
          amount1: '511139',
          amount2: '41.1',
          amount3: 15,
        },
        {
          id: '129871217',
          name: 'dddqqq',
          amount1: '511139',
          amount2: '41.1',
          amount3: 15,
        },
        {
          id: '129817127',
          name: 'dddqqq',
          amount1: '511139',
          amount2: '41.1',
          amount3: 15,
        },
      ],
      data1: ['name', 'amount1', 'amount2', 'amount3'],
      currentPage: 1,
      pageSize: 5 // Adjust this value based on your preference
    }
  },

  computed: {
    totalRows() {
      return this.data.length;
    },
    displayedData() {
      // Calculate the range of data to display based on current page and page size
      const startIndex = (this.currentPage - 1) * this.pageSize;
      const endIndex = startIndex + this.pageSize;
      return this.data.slice(startIndex, endIndex);
    },
  },

 methods: {
    currentChange(currentPage) {
      this.currentPage = currentPage;
    },
    handleChange(selection) {
      console.log(selection)
    },
    getRowKeys(row) {
      return row.id
    },
  },