Element Plus 版本<el-pagination>分页中自定义插槽，如何使用，请举例，并提供完整代码

在 Element Plus 的版本中，`<el-pagination>` 分页组件支持使用插槽（slot）来自定义页面的部分样式和内容。下面是一个基本的例子，展示了如何在每个部分插入自定义内容：

<template>
  <div>
    <!-- 使用默认布局 -->
    <el-pagination
      :page-sizes="[2, 3, 4, 5]"
      :page-size="pageSize"
      :current-page="currentPage"
      :total="totalCount"
      layout="prev, pager, next, jumper"
      @current-change="onCurrentChange"
      @size-change="onPageSizeChange">
      
      <!-- 自定义总条数 slot -->
      <template slot="total">
        共 {{ totalCount }} 条记录
      </template>

      <!-- 自定义上一页 slot -->
      <template slot="prev">
        <button slot="prev">上一页</button>
      </template>

      <!-- 自定义下一页 slot -->
      <template slot="next">
        <button slot="next">下一页</button>
      </template>

      <!-- 自定义跳转输入框 slot -->
      <template slot="jumper">
        跳转到第 <input v-model.number="jumpTo" @keyup.enter="onJump" />
      </template>

      <!-- 自定义页码区域 slot -->
      <template slot="pager">
        <span>第 {{ currentPage + 1 }} / {{ totalPages }}</span>
      </template>
    </el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      pageSize: 10,
      currentPage: 1,
      totalCount: 100, // 示例数据
      jumpTo: null,
      totalPages: Math.ceil(totalCount / pageSize),
    };
  },
  methods: {
    onCurrentChange(current) {
      console.log(`当前页：${current}`);
    },
    onPageSizeChange(size) {
      this.pageSize = size;
      console.log(`每页大小：${size}`);
    },
    onJump() {
      if (this.jumpTo && Number.isInteger(this.jumpTo)) {
        this.$emit('current-change', this.jumpTo);
      }
    },
  },
};
</script>

在这个例子中，我们覆盖了“总条数”、“上一页/下一页按钮”以及“跳转输入框”等部分，并通过 `v-model` 和事件监听器控制输入的行为。当你需要更改显示内容或添加功能时，只需替换或扩展这些插槽即可。