分页Pagination
你可能会说
内容太多一页放不下，底下加上 1、2、3 翻页。
分页是把大量结果分成多个可定位页面浏览的导航组件订单列表可每页显示 20 条并让用户跳到第 5 页。应显示当前页和总量并同步到网址；连续浏览的信息流可考虑加载更多。
你可以这样告诉 AI Agent
请给审计日志增加分页，把页码和筛选条件同步到网址。切页时保留筛选，刷新、返回和复制链接后都能恢复同一结果。请验证第一页、中间页、最后一页以及没有结果的情况。
什么时候用
- 长表格 / 订单列表，一页一页翻着看#1024已支付#1025待发货‹123…9›
- 搜索结果成百上千条，按页消化找到 2,431 条结果‹123…122›
- 需要记住位置，下次还能翻回来‹456…20›看到第 5 页，下次接着翻
- 数据量大，按页加载减轻前后端压力每页 20 条‹12›
什么时候不用
- 内容只有一页：无需显示分页控件‹1›
- 信息流需要连续浏览：可使用无限加载或“加载更多”‹123›连续浏览的信息流，被翻页操作反复打断
- 几百页页码全部铺开不加省略号‹123456789›
- 只是在同页切换几个分类：使用 标签页 Tabs全部待付款已完成这是分类切换，用标签页
组成结构 · Anatomy
‹
1
2
…
10
›
‹ › 前后翻页，翻到顶会置灰
当前页高亮，点击直达对应页
页数太多时折叠中间的页码
常见变体 · Variants
基础分页Basic
‹123…10›
页数多、需要直接跳到某一页
简洁分页Simple
‹3 / 12›
空间有限且只需前后翻页时
迷你分页Mini
‹123›
弹窗、小卡片里地方很小的分页
典型使用场景
订单列表翻页
全部订单
#20260718无线降噪耳机已完成¥899
#20260717机械键盘 87 键配送中¥329
共 128 条
‹123…13›
搜索结果浏览
找到约 2,431 条结果（0.32 秒）
2026 年最值得买的十款无线耳机
降噪耳机怎么选？看懂这三个参数
‹123…122›
数据表格按页加载
成员角色状态
林小狐管理员在线
陈一编辑离线
每页 20 条 · 共 342 条
‹123…18›
博客文章列表
山系生活：周末徒步装备清单
阅读 3.2k · 3 天前
我的极简工作台搭建记录
阅读 1.8k · 上周
‹123›
快速练习