目录叠卡 <IndexStack />
左边一列目录,右边的卡片像文件夹一样错开叠放。设 build: "focus" 后每按一次 → 下一张翻到最前,目录同步高亮。
Template and style descriptions are currently available in Chinese only.
- Group
- 结构 · 一页讲 3–5 件事,一次看一件
- Component
IndexStack·#index-stack- Interaction
- 按 → 把下一张卡翻到最前;跳页进入时全部叠好
Good for
- 一页里要依次讲 3–5 个模块
- 模块各有一小块数据
Avoid when
- 模块之间要并排比较:用 PanelCards
- 超过 5 项
Content limits
| 1 | items 3–5 项 |
| 2 | label ≤ 8 字,title ≤ 10 字,body ≤ 40 字 |
| 3 | 每项的 ui 和 PanelCards 相同 |
| 4 | 建议在 SlideDef 上设 build: "focus" |
Fields
| Field | Type | |
|---|---|---|
kicker · required | string | 小节名,2–8 字 |
title · required | string | string[] | 标题;数组手动断行 |
lead | string | 一两句导语,≤ 60 字 |
source | string | 事实出处 |
items · required | { label, icon, title, body, ui }[] | 条目 |
Example
<IndexStack
kicker="目录叠卡"
title="一页讲四件事,一次只看一件"
items={[
{ label: '风格令牌', icon: 'tuning', title: '风格令牌', body: '…', ui: { kind: 'figure', value: '5 种' } },
…
]}
/>