Pagination 分页组件

分页组件

```schema: scope=”body” { “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

  1.     }
  2. ]

}

  1. ### 简易模式
  2. ```schema: scope="body"
  3. {
  4.     "type": "service",
  5.     "api": "/api/mock2/crud/table",
  6.     "body": [
  7.         {
  8.             "type": "pagination",
  9.             "mode": "simple",
  10.             "activePage": 2,
  11.             "hasNext": true
  12.         }
  13.     ]
  14. }

属性表

属性名 类型 默认值 说明
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; 分页改变触发