iter(g42): pagination 支持每页条数切换

This commit is contained in:
HIsheR
2026-10-26 11:53:49 +08:00
parent 39d105ad30
commit 314366aa8d
9 changed files with 103 additions and 24 deletions
+15 -3
View File
@@ -35,7 +35,7 @@
"tooltip(props, trigger):悬浮提示,包裹触发器,hover / focus 延迟 150ms 出场,移出 / 失焦 / Esc 收起;视口一侧空间不足时自动翻转",
"popover(props, trigger):可交互气泡卡片,包裹触发器,默认点击开合 + 点外部 / Esc 收起,content 可放按钮等交互元素;视口一侧空间不足时自动翻转",
"skeleton(props):骨架屏占位,variant = text | rect | circle,text 支持 rows 多行,扫光微动画",
"pagination(props):独立分页器,page 信号双向绑定,页码过多折叠省略号,首末页禁用翻页,jumpable 时末尾可输入页码直接跳转,键盘可达",
"pagination(props):独立分页器,page 信号双向绑定,页码过多折叠省略号,首末页禁用翻页,jumpable 时末尾可输入页码直接跳转,键盘可达;pageSizes 可切每页条数",
"spinner(props):加载指示器,size 控制直径",
"progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复",
"tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签",
@@ -1210,7 +1210,7 @@
{
"id": "pagination",
"title": "分页器 Pagination",
"demo": "sec-table",
"demo": "sec-pagination",
"props": [
{
"n": "page",
@@ -1235,6 +1235,17 @@
"t": "(page: number) => void",
"k": 1,
"d": "翻页回调"
},
{
"n": "pageSizes",
"t": "number[]",
"d": "每页条数候选(如 [10, 20, 50]);传了才渲染条数切换器"
},
{
"n": "onPageSizeChange",
"t": "(size: number) => void",
"k": 1,
"d": "切换每页条数回调,同时自动回到第 1 页"
}
],
"example": "const page = signal(1); pagination({ page, pageSize: 3, total: 24, onChange: (p) => console.log(p) })",
@@ -1243,7 +1254,8 @@
"页码 ≤7 全部展开;更多时只保留首尾与当前页 ±1,缺口折叠为省略号",
"首末页自动禁用 ‹ › 翻页按钮,当前页禁点并标记 aria-current",
"与 dataTable 联动:把同一个 page 信号传给 dataTable 的 page 参数,两处翻页自动同步",
"键盘可达:全部是原生 button,Tab 聚焦后 Enter / Space 触发"
"键盘可达:全部是原生 button,Tab 聚焦后 Enter / Space 触发",
"pageSizes 传候选数组即出现「N 条/页」切换器,切换后自动回第 1 页;onPageSizeChange 拿新条数重算数据"
]
},
{