← 返回 Web 词条WebDisclosure Group原生支持
手风琴折叠组
在 Web 上叫Disclosure Group
多个 <details name="…">
原生 details 可直接展开收起;相同 name 可限制为同时只展开一项。键盘和视觉细节仍需测试。
它把多段内容收在各自标题下面,用户点击标题后展开或收起对应内容。
- 点一个标题展开内容再点就收起
- 一排问题点开才看答案的东西
- 几块内容一次只展开一块
- 折叠面板组
- 伸缩列表
- 可展开分组
结构示意图
其他平台的相似实现
iOS需自己实现
该平台没有原生实现iOS 没有独立的手风琴容器,系统只提供单个 Disclosure Group 这一层原语。
看 iOS 视角 →Android需自己实现
该平台没有原生实现通用 Material 3 没有 Accordion 或 Expansion Panel 组件,需要用列表、按钮和展开动画组合。
看 Android 视角 →使用规范
什么时候用
- 内容可以按主题分段,用户通常只需阅读其中少数部分
什么时候别用
- 内容很短可以一次读完,或用户必须同时比较多个分组