如何在开机时在表格中设置分页的页码2

<template>
  <div>
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <!-- 表格列配置 -->
    </el-table>
    <el-pagination
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="tableData.length">
    </el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [], // 表格数据
      currentPage: 1, // 当前页码
      pageSize: 10, // 每页显示数量
    }
  },
  methods: {
    // 分页变化时的回调
    handleCurrentChange(val) {
      this.currentPage = val;
    },
  },
  mounted() {
    // 获取表格数据的方法
    this.getTableData();
  },
}
</script>

methods: {
  getTableData() {
    // 获取原始数据，例如从后端接口获取
    // 假设原始数据为tableData

    // 分割数据成多个分页块
    const pageData = [];
    const pageCount = Math.ceil(tableData.length / this.pageSize);
    for (let i = 0; i < pageCount; i++) {
      const start = i * this.pageSize;
      const end = start + this.pageSize;
      pageData.push(tableData.slice(start, end));
    }

    // 更新表格数据为当前页的数据
    this.tableData = pageData[this.currentPage - 1];
  },
},