折叠问答 <FaqAccordion />
左边小节名、标题、导语和可选按钮;右边一列细线分隔的问题,每行编号、问题和圆形 +/− 按钮。一次只展开一条答案,每按一次 → 收起上一条、展开下一条。
版型與風格的說明目前僅提供簡體中文。
- 分組
- 问答 · 逐条展开
- 元件
FaqAccordion·#faq-accordion- 互動
- 配 build: 'focus':每按一次 → 展开下一条,上一条收起
適合
- 3–6 个常见问题,想一条一条讲
- 答案都短,一两句话
不適合
- 想一次看全部问答:用 Faq
- 问题是步骤:用 ProcessAccordion 或 StepTrack
內容上限
| 1 | items 3–6 个;q ≤ 24 字(一行 ≤ 18 字) |
| 2 | a ≤ 70 字 |
| 3 | title 1–2 行,每行 ≤ 8 字;lead ≤ 50 字 |
| 4 | 打印 / 总览只展开 open 指定的一条 |
欄位
| 欄位 | 型別 | |
|---|---|---|
kicker · 必填 | string | 标题上方的小节名,2–8 字 |
title · 必填 | string | string[] | 页面标题;传数组可手动断行,每项一行 |
lead | string | 一到两句导语,≤ 60 字 |
source | string | 事实出处;页面上有任何数据或事实时必填 |
hint | ReactNode | 页眉中间的操作提示,可用 <kbd> |
items · 必填 | { q, a }[] | 问题与答案 |
open | number | 完整状态展开的一条,默认 0 |
actions | { label, kind? }[] | 导语下的按钮,0–1 个 |
範例程式碼
<FaqAccordion kicker="常见问题" title={['五个常被问到的', '问题']} items={[{ q: '谁来做决定?', a: '…' }, …]} />