序列 IndexBar

根据字母 A ～ Z 排列内容。

安装

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。

根据字母 A ～ Z 排列内容。

何时使用

适用于列表的分类显示和快速定位。

示例

IndexBar

属性

属性	说明	类型	默认值
onIndexChange	当锚点变化时回调	`(index: string) => void`	-
sticky	是否开启锚点自动吸顶	`boolean`	`true`

Ref

属性	说明	类型
scrollTo	滚动到指定锚点	`(index: string) => void`

CSS 变量

属性	说明	默认值	全局变量
--sticky-offset-top	锚点自动吸顶时与顶部的距离	`0`	-

IndexBar.Panel

属性

属性	说明	类型	默认值
brief	右侧索引条中的显示内容	`ReactNode`	默认取 `index` 的第一个字符
index	索引（不可以重复）	`string`	-
title	左侧主内容区的分组标题	`ReactNode`	默认取 `index`