iter(g170): 分页器支持极简模式与单页隐藏
This commit is contained in:
+4
-1
@@ -1,6 +1,6 @@
|
||||
# @ui-arch 组件库 Agent 文档(无图形版)
|
||||
|
||||
> 自动生成于 2026-10-26T08:15:48.744Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 自动生成于 2026-10-26T08:16:48.747Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
|
||||
|
||||
## 快速上手
|
||||
@@ -850,6 +850,8 @@ space({ size: 'lg' }, button({ label: '保存' }), button({ label: '取消', var
|
||||
- page(必填):Signal<number> —— 当前页码信号,双向绑定:外部赋值自动翻页,点击页码写回信号
|
||||
- pageSize(必填):number —— 每页条数
|
||||
- total(必填):number —— 总条数
|
||||
- simple(默认 false):boolean —— 极简模式:只留上一页 / 下一页与「当前 / 总页」文字,适合表格工具栏等窄位
|
||||
- hideOnSinglePage(默认 false):boolean —— 只有一页时整个分页器隐藏(不占布局位)
|
||||
- onChange(回调):(page: number) => void —— 翻页回调
|
||||
- jumpable(默认 false):boolean —— 末尾显示跳页输入框(总页数 > 1 才出现);缺省 false
|
||||
- pageSizes:number[] —— 每页条数候选(如 [10, 20, 50]);传了才渲染条数切换器
|
||||
@@ -869,6 +871,7 @@ const page = signal(1); pagination({ page, pageSize: 3, total: 24, onChange: (p)
|
||||
4. 与 dataTable 联动:把同一个 page 信号传给 dataTable 的 page 参数,两处翻页自动同步
|
||||
5. 键盘可达:全部是原生 button,Tab 聚焦后 Enter / Space 触发
|
||||
6. pageSizes 传候选数组即出现「N 条/页」切换器,切换后自动回第 1 页;onPageSizeChange 拿新条数重算数据
|
||||
7. 空间紧的地方传 simple:页码区换成「3 / 5」文字 + 两个箭头(文字带 aria-live,翻页会被读屏播报);数据少到只有一页时再传 hideOnSinglePage,整块自动消失而不是留个灰掉的 1
|
||||
|
||||
现场演示:apps/docs/demo.html#sec-pagination
|
||||
|
||||
|
||||
Reference in New Issue
Block a user