pagination.md

url
pages/vue/pagination/pagination

Pagination 分页器

::: tip 组件名：uni-pagination 代码块： uPagination :::

分页器组件，用于展示页码、请求数据等。

安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

如需通过npm方式使用uni-ui组件，另见文档：https://ext.dcloud.net.cn/plugin?id=55

基本用法

在 template 中使用组件

<uni-pagination title="标题文字" total="20"></uni-pagination>
<uni-pagination title="标题文字" show-icon="true" total="50" current="2"></uni-pagination>

API

Pagination Props

属性名	类型	默认值	说明
prevText	String	上一页	左侧按钮文字
nextText	String	下一页	右侧按钮文字
value/v-model	Number	1	当前页
current	Number	1	当前页, 优先级高于 value
total	Number	0	数据总量
pageSize	Number	10	每页数据量
showIcon	Boolean	false	是否以 icon 形式展示按钮

Pagination Events

事件称名	说明	返回值
@change	点击页码按钮时触发	e={type,current} current为当前页，type值为：next/prev，表示点击的是上一页还是下一个