折叠问答 <FaqAccordion />
左边小节名、标题、导语和可选按钮;右边一列细线分隔的问题,每行编号、问题和圆形 +/− 按钮。一次只展开一条答案,每按一次 → 收起上一条、展开下一条。
Template and style descriptions are currently available in Chinese only.
- Group
- 问答 · 逐条展开
- Component
FaqAccordion·#faq-accordion- Interaction
- 配 build: 'focus':每按一次 → 展开下一条,上一条收起
Good for
- 3–6 个常见问题,想一条一条讲
- 答案都短,一两句话
Avoid when
- 想一次看全部问答:用 Faq
- 问题是步骤:用 ProcessAccordion 或 StepTrack
Content limits
| 1 | items 3–6 个;q ≤ 24 字(一行 ≤ 18 字) |
| 2 | a ≤ 70 字 |
| 3 | title 1–2 行,每行 ≤ 8 字;lead ≤ 50 字 |
| 4 | 打印 / 总览只展开 open 指定的一条 |
Fields
| Field | Type | |
|---|---|---|
kicker · required | string | 标题上方的小节名,2–8 字 |
title · required | string | string[] | 页面标题;传数组可手动断行,每项一行 |
lead | string | 一到两句导语,≤ 60 字 |
source | string | 事实出处;页面上有任何数据或事实时必填 |
hint | ReactNode | 页眉中间的操作提示,可用 <kbd> |
items · required | { q, a }[] | 问题与答案 |
open | number | 完整状态展开的一条,默认 0 |
actions | { label, kind? }[] | 导语下的按钮,0–1 个 |
Example
<FaqAccordion kicker="常见问题" title={['五个常被问到的', '问题']} items={[{ q: '谁来做决定?', a: '…' }, …]} />