低代码平台表单设计器 unione form editor 组件 —— 子表单组件

低代码平台表单设计器 unione-form-editor 组件 —— 子表单组件在企业级表单设计中我们经常会遇到主信息附带一套专属详情信息的场景一份员工表 → 附带一套档案信息一份合同主表 → 附带一套合同条款一个设备信息 → 附带一套技术参数一个客户信息 → 附带一套开票资料这类数据是一对一关联关系不适合用子数据一对多也不适合全部塞在主表单显得臃肿。这时就需要专业组件 ——子表单组件。子表单组件是用于一对一关联数据的嵌入式容器组件它以独立子表单的形式嵌入主表单实现主表 子表一对一绑定。它的使用方式与子数据组件一致先配置数据模型一对一关联再在表单中拖拽子表单组件并绑定模型即可。它让表单结构更清晰、模块更独立、数据更规范是企业级结构化表单的必备组件。一、子表单组件核心定位一对一关联的嵌入式子表单核心一句话子表单 主表单的 “一对一专属子表单”与子数据组件区别非常清晰子数据组件一对多 → 表格形式、多条明细子表单组件一对一 → 嵌入式表单、单条详情子表单组件的作用将一部分字段独立成子表保持主表单简洁实现主表与子表一对一外键关联以嵌入式表单展示不跳转、不弹窗与主表单同步保存、同步校验结构更清晰、权限更独立、扩展更灵活二、子表单组件核心特性一对一关联关系企业级标准外键主表与子表严格一对一绑定一条主数据对应一条子数据结构规范、查询清晰。嵌入式展示不弹窗、不跳转子表单直接内嵌在主表单中像原生表单一样展示、编辑体验流畅统一。使用方式与子数据组件完全一致配置逻辑、操作步骤、数据模型绑定方式和子数据组件相同会用子数据就会用子表单。独立字段、独立布局、独立样式子表单可拥有自己的布局、栅格、标题、组件不污染主表单结构。与主表单同步提交、同步校验点击主表单保存时子表单数据自动关联、自动保存、自动校验。支持折叠 / 展开保持表单简洁长表单场景可折叠子表单区域让界面更清爽。支持权限独立控制可单独设置子表单是否可编辑、查看、隐藏满足复杂权限场景。三、子表单组件标准配置流程三步完成第一步数据模型建立一对一关联在主表数据模型中添加一对一关联绑定对应的子表模型设置外键关系。第二步表单设计器拖拽子表单组件将子表单组件拖入主表单画布中。第三步绑定一对一关联数据模型选择已配置好的一对一关联系统自动加载子表单结构即可完成内嵌。全程可视化、无代码、自动关联。四、子表单组件高频真实场景员工信息表 档案子表单一对一客户信息表 开票资料子表单设备主表 技术参数子表单合同主表 合同条款子表单项目信息 项目预算子表单工单主表 故障详情子表单商品主表 资质证书子表单凡是 “一个主信息 一套专属详情”都用子表单组件。五、结语子表单组件是企业表单实现结构化、模块化、规范化的关键组件。它以极简方式解决一对一关联场景让表单不再臃肿、结构不再混乱、数据不再散落。使用方式与子数据保持一致学习成本极低是低代码平台中最实用、最优雅的详情容器组件。项目已开源欢迎 Star 收藏GitHubhttps://github.com/unione-cloud/unione-form-editorGiteehttps://gitee.com/unione-cloud/unione-form-editor