分页符 PageIndicator
指示当前显示的是多页面视图的哪一页。
安装
npm install antd-mobile@5.43.0
antd-mobile 是移动网页组件库，不是 React Native 或小程序组件。React 19 项目需在入口用 unstableSetRender 注册 createRoot，否则 Toast、Dialog 等命令式 API 无法渲染；深色模式通过 <html data-prefers-color-scheme="dark"> 切换。
示例来自 Ant Design Mobile 官方仓库（MIT），固定在 npm 5.43.0 对应的提交；示例中的 DemoBlock 等展示辅助组件由 JGuang 重写，不属于 antd-mobile 的 API。
指示当前显示的是多页面视图的哪一页。
何时使用
适用于表示当前内容区块可以横向滚动翻页。
示例
PageIndicator
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| color | 颜色 | 'primary' | 'white' | 'primary' |
| current | 当前页（从 0 开始计数） | number | - |
| direction | 方向，默认是水平方向 | 'horizontal' | 'vertical' | 'horizontal' |
| total | 总页数 | number | - |
CSS 变量
| 属性 | 说明 | 默认值 |
|---|---|---|
| --active-dot-border-radius | 当前页的圆角大小 | var(--dot-border-radius) |
| --active-dot-color | 当前页的颜色 | var(--adm-color-primary) |
| --active-dot-size | 当前页的大小 | 13px |
| --dot-border-radius | 非当前页的圆角大小 | 1px |
| --dot-color | 非当前页的颜色 | var(--adm-color-light) |
| --dot-size | 非当前页的大小 | 3px |
| --dot-spacing | 页码指示器小圆点之间的间距 | 3px |