防护层 <ShieldLayers />
左侧 2–5 道发光半环围住受保护的核心，右侧从外到内列出每层拦什么；逐条展开时一层层亮起。
Template and style descriptions are currently available in Chinese only.
- Group
- 机制 · 纵深防御
- Component
ShieldLayers·#shield-layers- Interaction
- 每按一次 → 点亮一道环和对应说明
Good for
- 安全、过滤、审核类的多层机制
- 强调“外层先拦，里层兜底”的顺序
Avoid when
- 层之间没有内外顺序：用 LayerStack
- 要讲每层的细节步骤：用 RequestJourney
Content limits
| 1 | layers 2–5 层（外层在前）：name ≤ 10 字，note ≤ 34 字，tag ≤ 10 个字符 |
| 2 | core ≤ 4 字 |
Fields
| Field | Type | |
|---|---|---|
kicker · required | string | 标题上方的小节名，2–8 字 |
title · required | string | string[] | 页面标题；传数组可手动断行，每项一行 |
lead | string | 一到两句导语，≤ 60 字 |
source | string | 事实出处；页面上有任何数据或事实时必填 |
hint | ReactNode | 页眉中间的操作提示，可用 <kbd> |
layers · required | { name, note, tag? }[] | 从外到内，每层一步 |
core · required | string | 被保护的对象 |
Example
<ShieldLayers kicker="安全" title="从外到内的几层过滤" core="源站" layers={[{ name: '网络层 DDoS 防护', tag: 'L3/4', note: '…' }, …]} />