- 分組
- 预告 · 展望
- 元件
Teaser·#teaser- 互動
- 描边数字随鼠标漂移,逐位升起。
適合
- “接下来会发生什么”:下一版本、下一季度、路线图要点
- 章节过渡页
不適合
- 要传达确定的结论:用 Closing
- 没有可以引用的前瞻信息:不要编造
內容上限
| 1 | numeral 1–3 个字符 |
| 2 | word ≤ 10 个字符 |
| 3 | notes 2–4 条:key ≤ 16 个字符,text ≤ 34 字 |
欄位
| 欄位 | 型別 | |
|---|---|---|
kicker · 必填 | string | 标题上方的小节名,2–8 字 |
title · 必填 | string | string[] | 页面标题;传数组可手动断行,每项一行 |
lead | string | 一到两句导语,≤ 60 字 |
source | string | 事实出处;页面上有任何数据或事实时必填 |
hint | ReactNode | 页眉中间的操作提示,可用 <kbd> |
numeral · 必填 | string | 描边大数字 |
word | string | 衬线斜体词,自动加引号 |
notes · 必填 | { key, text }[] | 前瞻笔记 |
範例程式碼
<Teaser
kicker="下一站"
title="Lumen 14 cedar"
numeral="14"
word="cedar"
notes={[
{ key: 'armel', text: 'aurora 是最后一个支持 armel 的版本。' },
{ key: 'KDE Frameworks 5', text: '将在 cedar 周期中移除。' },
]}
/>