element/examples/docs/pagination.md

基础用法

适用广泛的基础用法。

<el-pagination
  layout="prev, pager, next"
  :total="50">
</el-pagination>

小型分页

在空间有限的情况下，可以使用简单的小型分页。

<el-pagination
  small
  layout="prev, pager, next"
  :total="50">
</el-pagination>

复杂分页

能够承载复杂交互的分页，显示更多页码。

<el-pagination
  layout="prev, pager, next"
  :total="1000">
</el-pagination>

附加功能

在复杂分页的基础上，根据场景需要，可以添加其他功能模块。

<el-pagination @sizechange="handleSizeChange" @currentchange="handleCurrentChange" layout="sizes, prev, pager, next, jumper, total" :total="1000">

<el-pagination
  layout="sizes, prev, pager, next, jumper, total"
  :total="1000">
</el-pagination>

API

参数	说明	类型	可选值	默认值
small	小型分页样式	Boolean		false
page-size	每页个数	Number		10
total	总个数	Number		0
current-page	当前页数	Number		0
layout	组件布局，子组件名用逗号分隔。	String	prev, pager, next, jumper, slot, ->, total	'prev, pager, next, jumper, slot, ->, total'
page-sizes	切换每页显示个数的子组件值	Number[]		[10, 20, 30, 40, 50, 100]

事件

事件名称	说明	回调函数
sizechange	pageSize 改变时会触发	size
currentchange	currentPage 改变时会触发	currentPage