| 组件名称 | 说明 |
|---|
| 矩形 | 一个空心矩形块，可添加文本，调整样式和形状 |
| 圆形 | 一个空心圆形块，可添加文本，调整样式和形状 |
| 形状 | 一个实心几何形状，可以切换为圆形、三角形、矩形，可以调整样式和形状 |
| 布局 | 布局容器，可以灵活设置行列数，每个块都能调整尺寸、插入自定义内容 |
| 线 | 可调整颜色、线宽、类型的线条 |
| JSX | 完全用代码控制的自定义渲染内容 |
通用PC组件库是PC页面开发中使用最为频繁的组件集合，其中包括了 6 大类组件：基础、排版布局、导航、表单、数据展示、其他。本文将使用一句话描述的方式，帮助读者快速了解所有组件。
| 组件名称 | 说明 |
|---|
| 文本 | 显示一段文本，相当于 <span> |
| 链接 | 相当于 <a> 标签 |
| 文本排版 | 文本容器，可以放置多个文本、标签，可以排序，可以设置每个子元素的样式 |
| 富文本 | 显示一段提前编辑好的富文本，不是富文本编辑器 |
| 图片 | 显示一个图片，相当于 <img> |
| 工具条 | 一个容器，用来放置若干操作 |
| 按钮 | 按钮用于开始一个即时操作 |
| 图标 | 语义化的矢量图形，支持Antd 图标库、Iconfont、自定义图标 |
| 标签列表 | 一个容器，可用来放置若干标签 <Tag> |
| 组件名称 | 说明 |
|---|
| 卡片 | 通用卡片容器 |
| 标签页 | 选项卡切换组件 |
| 列表容器 | 以指定的方式循环渲染列表数据 |
| 折叠面板 | 可以折叠/展开的内容区域，只有一个面板 |
| 自定义容器 | 一个容器，相当于 <div>，常用来排版和布局 |
| 状态容器 | 一个能够保存若干状态值的容器，每个状态对应一个UI |
| 气泡 | 点击/鼠标移入元素，弹出气泡式的卡片浮层 |
| 气泡确认框 | 点击元素，弹出气泡式的确认框 |
| 分割线 | 区隔内容的分割线 |
| 组件名称 | 说明 |
|---|
| 面包屑 | 显示当前页面在系统层级结构中的位置，并能向上返回 |
| 分页器 | 分页器用于分隔长列表，每次只加载一个页面 |
| 导航菜单 | 为页面和功能提供导航的菜单列表 |
| 步骤条 | 引导用户按照流程完成任务的导航条 |
| 组件名称 | 说明 |
|---|
| 数据表格 | 显示表格数据的组件，可灵活配置表格列、分页、运行时列设置等 |
| 描述列表 | 带标题和描述项的列表，可灵活配置描述项 |
| JSON展示 | 用于展示JSON数据的组件，可配置展开深度 |
| 树 | 显示树形数据，支持字段过滤、禁用、勾选、拖拽等 |
| 时间轴 | 垂直展示的时间流信息 |
| 日历 | 日历组件，支持年月切换、日期内容插槽等配置 |
| 进度条 | 支持多种形态的进图条，可灵活配置样式 |
| 锚点容器 | 带锚点内容锚点的容器，点击锚点连接可快速定位到对应内容 |
| 组件名称 | 说明 |
|---|
| 置底工具栏 | 可以自定义操作项的按钮容器 |
| 警告提示 | 显示消息以及描述文字的内容框 |
| iFrame | 无缝嵌入另一个HTML页面的容器，与主页面内容隔离、独立渲染 |
| 二维码 | 根据传入的链接和Logo图片，生成一个二维码 |
| 结果页 | 结果状态展示器，可配置标题、副标题以及自定义内容 |
| 加载中 | 一个带有加载中效果的容器，可设置自定义内容 |
| 文字提示 | 为某个内容提供鼠标悬浮时弹出气泡的功能，进行解释说明 |
| 下拉菜单 | 可以弹出操作项的组件，点击时会将当前项数据传递给事件处理器 |
| 排序标题栏 | 排序按钮容器，可实现对多个字段的排序操作 |
| 播放器 | 视频播放器，需要指定视频地址，支持灵活配置 |
| 轮播图 | 轮播显示若干项内容的组件，可以手动或自动切换显示内容 |