elementui 前端分页

Element UI 是一套基于 Vue.js 2.0 的桌面端组件库，它提供了很多实用的组件和工具，其中包括分页组件。

在 Element UI 中，分页使用 `el-pagination` 组件来实现，它支持常见的分页功能，包括跳转、每页显示数量、总页数等。

以下是一个简单的分页示例：

<template>
  <div>
    <el-pagination
      :total="100"
      :page-size="10"
      layout="total, prev, pager, next, jumper"
      @current-change="handleCurrentChange"
    />
  </div>
</template>

<script>
export default {
  methods: {
    handleCurrentChange(page) {
      console.log(`当前页码：${page}`);
    },
  },
};
</script>

在上面的示例中，我们使用了 `el-pagination` 组件，并将总页数设置为 100，每页显示数量设置为 10。`layout` 属性用来定义分页布局，这里设置为了 `total, prev, pager, next, jumper`，分别表示总页数、上一页、页码、下一页和跳转输入框。`@current-change` 事件用来监听当前页码的变化，当页码变化时，会触发 `handleCurrentChange` 方法。

通过上面的示例，你可以快速实现一个简单的分页功能。如果需要更复杂的分页功能，可以查看 Element UI 的文档，了解更多高级用法。