ui component composite type / Card Grid
Card Grid
把多个卡片按响应式栅格、列数和间距组织起来。
Key fields
Identity
- Subtype
- 复合组件
- Parent Taxonomy
- Content & Data Display
What
- Definition
- 把多个卡片按响应式栅格、列数和间距组织起来。
- Composition & States
- 容器 + 子组件/部件 + 状态协调 + 操作反馈 + 错误/空状态(按需)
Why
- Role
- 组织子组件、管理局部状态和交互顺序,并保持组合后的语义与可访问性。
Where
- Applicable Context
- Content & Interface Language, Default, Focused, Disabled, Loading
How
- Checklist
- 是否有清晰的阅读顺序、焦点顺序和退化方案;子组件状态是否一致;长内容、错误、加载和空状态是否可用。
Lifecycle
- Status
- 启用
Relations
- Related Content
- Content & Interface Language
Related content
Relationships come from the local knowledge graph and include reverse links.
- Content & Interface Language内容与界面语言Related
用标签、提示、说明和错误文案帮助用户理解界面和采取行动。
- Content & Data Display内容与数据展示Related
用于呈现文本、媒体、对象、列表、表格、指标和关系数据的组件。
- Card ActionCard ActionReverse · Related
卡片级主要操作或可点击入口
- Card BodyCard BodyReverse · Related
承载卡片主体摘要或内容的区域
- DefaultDefaultRelated
默认状态,组件可被使用但没有额外交互反馈。
- DisabledDisabledRelated
组件暂时不可操作的状态。
- FocusedFocusedRelated
键盘或其他输入方式当前定位到组件的状态。
- LoadingLoadingRelated
组件正在等待异步结果的状态。