ant-design-vue/components/pagination/index.en-US.md

category	type	title	cols	cover
Components	Navigation	Pagination	1	https://gw.alipayobjects.com/zos/alicdn/1vqv2bj68/Pagination.svg

A long list can be divided into several pages using Pagination, and only one page will be loaded at a time.

When To Use

• When it will take a long time to load/render all items.
• If you want to browse the data by navigating through pages.

API

<a-pagination @change="onChange" :total="50" />

Property	Description	Type	Default	Version
current(v-model)	current page number	number	-
defaultCurrent	default initial page number	number	1
defaultPageSize	default number of data items per page	number	10
disabled	Disable pagination	boolean	-	1.5.0
hideOnSinglePage	Whether to hide pager on single page	boolean	false
itemRender	to customize item innerHTML	(page, type: 'page' | 'prev' | 'next', originalElement) => vNode | v-slot	-
pageSize(v-model)	number of data items per page	number	-
pageSizeOptions	specify the sizeChanger options	string[]	['10', '20', '30', '40']
responsive	If size is not specified, Pagination would resize according to the width of the window	boolean	-	3.1
showLessItems	Show less page items	boolean	false	1.5.0
showQuickJumper	determine whether you can jump to pages directly	boolean	false
showSizeChanger	Determine whether to show pageSize select, it will be true when total > 50	boolean	-
showTitle	Show page item's title	boolean	true	1.5.0
showTotal	to display the total number and range	Function(total, range)	-
simple	whether to use simple mode	boolean	-
size	specify the size of Pagination, can be set to small	string	""
total	total number of data items	number	0

events

Events Name	Description	Arguments
change	Called when the page number or pageSize is changed, and it takes the resulting page number and pageSize as its arguments	Function(page, pageSize)	noop
showSizeChange	a callback function, executed when pageSize is changed	Function(current, size)	noop