卡片

用于展示相关信息的容器。

何时使用

• 当需要展示一组相关内容时，例如产品信息、用户资料等。
• 在需要强调某个特定信息块时，使用卡片可以提高可见性。

一、属性

1. 主要属性

（1）数据源

详见 数据绑定。

（2）功能 - 标题

卡片的标题支持输入或结合多种组件实现，默认为输入模式。

标题 - 输入： 标题支持三种值绑定方式，默认为自定义且标题为“卡片”。

• 手动赋值： 即输入固定的文本。
• 字段： 父级组件绑定 API 或查询模型后，可绑定其中某一字段。
• 成员变量： 本页面内其他组件的值。

标题 - 设计： 适用于标题包含其他组件时使用，可在标题区域添加其他组件。

（3）操作区 - 隐藏

卡片的右上角操作区默认隐藏，可在此区域添加组件，也可隐藏此区域。

（4）外观

• 尺寸： 提供默认和小号两种尺寸，主要区别在于标题文字大小和卡片内容的内边距大小。
• 显示边框： 默认开启，如不需要边框可直接关闭。
• 浮动阴影： 默认关闭，开启后鼠标悬浮时呈现浮动阴影，使卡片更具立体感。

（5）状态 - 载入状态

载入状态默认关闭，开启后卡片数据加载时呈现骨架屏动态加载效果。

2. 通用属性

详见通用属性。

二、样式

无特殊样式配置，详见 通用样式。

三、常见使用场景

1. 产品展示

在电商平台中，使用卡片展示每个产品的图片、描述和价格。

2. 用户资料

在社交媒体或管理系统中，使用卡片展示用户的头像、姓名和基本信息。

3. 信息摘要

在仪表盘中，使用卡片展示关键指标或数据的摘要，便于快速浏览。

4. 内容预览

在博客或新闻网站中，使用卡片展示文字的标题、摘要和图片，吸引用户点击。

5. 操作面板

在应用程序中，使用卡片作为操作面板，展示可执行的功能或操作选项。