组件列表
组件列表是从零搭表的主入口：按分组浏览可拖拽的组件与模板，也可用顶部「字段」「大纲」切换预置业务字段和结构树。搜索、拖入、改标题、预览，通常都从这里开始。
演示环境可在表单列表展开 业务模板，打开「意见反馈」或「员工信息卡」，对照本文从基础组件起稿、用三列栅格排版。
在哪里找
左侧功能栏点击 组件列表 图标（网格样式，位于表单列表下方）。当前选中的入口会高亮。
打开后，左侧面板顶部有三个标签：组件、字段、大纲。默认停在 组件。搜索框占位文案是 输入关键字搜索。
| 区域 | 作用 | 说明 |
|---|---|---|
| 组件 | 按分组拖拽组件、模板 | 本文重点 |
| 字段 | 使用预置业务字段 | 字段简介 |
| 大纲 | 树形查看与定位结构 | 大纲简介 |
演示环境的 字段 里已有「商品表」「用户表」等预置字段，可直接拖到画布，不必每次从空白输入框改起。
怎么用（分步）
- 打开组件列表，确认顶部停在 组件。
- 在搜索框输入关键字（如「评分」），或点击分组标题展开 / 收起。
- 将组件 拖到 工作区；也可以直接 点击 列表项，组件会追加到画布末尾。
- 点选画布上的字段，在右侧属性栏的 组件配置 里改 字段名称、是否必填、占位等。
- 用顶部预览试填。
不知道组件叫什么时，用搜索比逐组翻更快。例如输入「评分」，列表会只留下评分组件。
拖入后的默认标题往往是「输入框」「多行输入框」。点选字段，在 组件配置 → 基础配置 → 字段名称 改成业务名（如「联系人」）。
完整步骤见：添加组件。
分组速览
分组名称以界面为准。常见分组如下。
模板
可复用的常见结构，拖入即可得到一组排好的布局或业务片段。
- 三列栅格、四列栅格、4x3表格
- 金额、时长
详见：组件模板
基础组件
用于收集数据的字段控件。
- 输入框、多行输入框、密码输入框、提及、分段控制器、数字输入框
- 单选框、多选框、选择器、开关、评分、滑块
- 时间、时间区间、日期、日期区间、颜色选择器
- 级联选择器、上传、穿梭框、树形控件、树形选择、省市区选择器
- 富文本框、数据表格、Vxe数据表格
- 唯一值、手写签名、计算公式、子表单选择器、位置选择器
详见：基础组件
子表单组件
用于一对多明细、分步、分组等复杂数据结构。
- 子表单、分组、分步表单
- 表格表单、表格表单Pro、嵌套表单、无限级表单
详见：子表单组件
容器组件
承载自定义区域或特殊渲染内容。界面上常见：插槽区域、动态区域、Vue组件、表单项。
详见：容器组件
图表组件
折线图、柱状图、饼图、漏斗图、仪表盘，以及流程图、思维导图等可视化组件。
详见：图表组件
辅助组件
说明文案、按钮、媒体、二维码等，偏展示与操作，不一定产生业务字段值。
详见：辅助组件
布局组件
栅格布局、卡片、标签页、折叠面板、行内布局等，用于排版与信息分区。
详见：布局组件
选型建议
| 你的目标 | 优先看 |
|---|---|
| 收集姓名、日期、选项等数据 | 基础组件 |
| 多行明细、分步填写 | 子表单组件 |
| 分区、多列、页签 | 布局组件 / 模板 |
| 提示、按钮、图片说明 | 辅助组件 |
| 统计图、流程示意 | 图表组件 |
| 快速复用固定结构 | 模板、表单列表 |
| 口径统一的姓名、手机号 | 字段 |
业务示例
以下均可在演示环境的表单列表 → 业务模板 中打开对照。
入门：三个字段做意见反馈
背景：运营要收集用户建议，字段很少，从空白画布用基础组件就能搭完。
步骤：
- 打开组件列表，展开 基础组件（或搜索组件名）。
- 依次拖入（或点击）输入框、多行输入框、评分。
- 点选各字段，在 组件配置 把 字段名称 改成「联系人」「意见」「满意度」；需要必填时打开对应开关。
- 顶部点 预览，在 表单模式 试填后点 提交。
预期：画布上三项都在；预览里联系人、意见可输入，满意度可点星，未填必填项时会提示。
演示模板「意见反馈」已按上述结果配好，可直接打开对照。
常用：模板起稿再微调
背景：员工信息要横排展示姓名、部门、入职日期，手拖栅格再调列数较慢。
步骤：
- 在 模板 分组拖入 三列栅格（三列、每列占 8/24）。
- 把输入框、选择器、日期分别放进三列，标题改为「姓名」「部门」「入职日期」。
- 需要第二行时，再拖一块三列栅格，放入岗位、手机号、直属上级。
- 用快速布局或栅格属性微调列宽，预览检查窄屏是否换行。
预期：第一行三列对齐；大纲里能看到两层「栅格布局」，每层三个栅格格子。
演示模板「员工信息卡」可直接打开对照。
常用：用大纲核对刚拖进去的字段
背景：字段一多，画布上不容易点准，也怕漏拖。
步骤：打开「意见反馈」或「员工信息卡」后，切到 大纲。点击「联系人」或「姓名」，工作区与右侧配置会同步选中。
预期：树节点顺序与画布一致；嵌套栅格时，大纲能看到「栅格布局 → 栅格格子 → 字段」。
注意点
- 点分组标题只展开或收起，不会把组件加到画布；要拖拽或点击具体组件。
- 模板是局部结构，表单列表才是整张业务表。不要把「三列栅格」当成「入职登记」整表来用。
- 字段列表是否有预置内容，取决于环境是否传入
field；列表为空时，仍可用组件分组从零拖拽。 - 拖入后检查字段 ID 是否冲突，并到预览里确认必填、选项和窄屏布局。
- 分组是否显示、默认是否收起，可由开发人员配置，见下方技术文档。