← All templates

开关设置窗 <ToggleCard />

一个设置窗口,每行一个图标、名称、说明和开关。开关可以现场点,但只是演示,不控制任何东西。

Template and style descriptions are currently available in Chinese only.

Group
要点 · 哪些开着、哪些关着
Component
ToggleCard · #toggle-card
Interaction
点击开关可切换,仅为演示

Good for

  • 讲默认设置、功能开关、可选项
  • 桌面风格的演示

Avoid when

  • 要说明的是状态好坏:用 StatusGrid

Content limits

1rows 3–5 行:label ≤ 10 字,note ≤ 24 字
2title ≤ 2 行 × 8 字

Fields

FieldType
kicker · requiredstring小节名,2–8 字
title · requiredstring | string[]标题;数组手动断行
leadstring一两句导语,≤ 60 字
sourcestring事实出处
file · requiredstring窗口标题
rows · required{ icon, label, note, on, spot? }[]设置行

Example

<ToggleCard kicker="放映" title="…" file="放映设置" rows={[{ icon: 'monitor', label: '全屏', note: 'F 键', on: true }, …]} />