- 分組
- 证据 · 一个案例三个数
- 元件
CaseStudy·#case-study- 互動
- build:指标逐个出现
適合
- 介绍一个具体案例、地点、项目,并给出三个关键数
- 客户案例(主图用真实截图)
不適合
- 只有一个数:用 BigStat
- 多个案例并列:用 WorkCards
內容上限
| 1 | title ≤ 2 行 × 10 字 |
| 2 | tags 0–4 个,每个 ≤ 6 字 |
| 3 | body ≤ 70 字 |
| 4 | metrics 正好 3 个:value ≤ 7 个字符,label ≤ 12 字 |
欄位
| 欄位 | 型別 | |
|---|---|---|
image · 必填 | { src, alt, credit?, focus? } | 主图 |
kicker · 必填 | string | 小节名 |
title · 必填 | string | string[] | 标题 |
tags | string[] | 标签 |
body · 必填 | string | 简介 |
metrics · 必填 | { value, label }[] | 三个指标,每个一个 build 步骤 |
source | string | 事实出处 |
範例程式碼
<CaseStudy image={{ src: aerial, alt: '…' }} kicker="案例" title="…" tags={['世界遗产']} body="…" metrics={[{ value: '34.8万', label: '平方公里面积' }, …]} />