mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-14 00:41:26 +08:00
dd1d66c93f
* feat:Pagination * feat:Pagination完善 * feat:Pagination外层样式 * feat:Pagination兼容showPageInput * feat:Pagination完善 * feat:Pagination snap Co-authored-by: 王飞龙 <wangfeilong02@baidu.com>
3.0 KiB
3.0 KiB
title | description | type | group | menuName | icon | order |
---|---|---|---|---|---|---|
Pagination 分页组件 | 0 | ⚙ 组件 | Pagination | 73 |
分页组件
{
"type": "service",
"api": "/api/mock2/crud/table",
"body": [
{
"type": "pagination",
"layout": "total,perPage,pager,go",
"mode": "normal",
"activePage": 2,
"lastPage": 99999,
"total": 999,
"perPage": 10,
"maxButtons": 7,
"showPerPage": true,
"perPageAvailable": [10, 20, 50, 100],
"showPageInput": true,
"disabled": false
}
]
}
简易模式
{
"type": "service",
"api": "/api/mock2/crud/table",
"body": [
{
"type": "pagination",
"mode": "simple",
"activePage": 2,
"hasNext": true
}
]
}
属性表
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
type | string |
"pagination" |
指定为 Pagination渲染器 |
mode | normal | simple |
normal |
迷你版本/简易版本 只显示左右箭头,配合hasNext使用 |
layout | string | string[] |
["pager"] |
通过控制layout属性的顺序,调整分页结构布局 |
maxButtons | number |
5 |
最多显示多少个分页按钮,最小为5 |
lastPage | number |
总页数 (设置总条数total的时候,lastPage会重新计算) | |
total | number |
总条数 | |
activePage | number |
1 |
当前页数 |
perPage | number |
10 |
每页显示多条数据 |
showPerPage | boolean |
false | 是否展示perPage切换器 layout和showPerPage都可以控制 |
perPageAvailable | number[] |
[10, 20, 50, 100] |
指定每页可以显示多少条 |
showPageInput | boolean |
false | 是否显示快速跳转输入框 layout和showPageInput都可以控制 |
disabled | boolean |
false | 是否禁用 |
onPageChange | page、perPage改变时会触发 | (page: number, perPage: number) => void; | 分页改变触发 |