应用开发平台集成表单设计器系列之1——技术预研与技术选型

背景

表单的可视化配置,是低代码开发平台的重要组成部分。平台已实现的低代码配置部分,可以配置生成前端vue页面,对于属性较少的实体,如系统基础数据的管理、配置数据的维护,采用标准化的模板模式来生成,配置简便,快速高效。

但不得不说,对于非标准化的复杂表单,如三五十个字段的单表,需要分组显示;主子关系表,需要多tab页展示……在这些场景下,表单的可视化配置仍然很有价值,相比原生开发,或者基于平台现有的模板式生成后手工修改,仍存在大幅提高开发效率的空间。

技术预研

市面上已经有一些可视化表单配置组件了,通常称之为表单设计器。使用vue,基于element ui/plus技术栈,免费开源,常见的的有以下几个:form-generator、FormMaking、form-create-designer,下面来具体说一说。

form-generator

首先来说下,form-generator,这是一款出现比较早的可视化表单设计器。
开源地址:https://gitee.com/mrhj/form-generator
开源协议:MIT
image.png
最后一次更新日期大概是2021年的3月份,已过去2年半
image.png
基本可以视为已经停止更新了。

技术栈:只支持vue2和Element UI
文档:无官网,无专门说明文档,仅有几篇教程
功能:“纯”前端设计器,跟后端难以集成与整合,例如,下拉列表中的数据不能从后端接口中拉取

预览地址:https://mrhj.gitee.io/form-generator/#/
image.png

FormMaking

其次说下,FormMaking。
开源地址:https://github.com/GavinZhulei/vue-form-making
开源协议:MIT
image.png
gitee只有vue2版本的库,vue3的版本只在官网上。
image.png

技术栈:多版本,既有vue2和Element UI的版本,也有vue3和Element Plus的版本
文档:有官网,文档看上去比较全面,https://form.making.link/docs/guide/introduction.html
功能:收费版功能全面,组件多,提供丰富api与后端集成,基础版功能受限

版本对比
image.png

放两张截图直观对比下开源免费版和商业收费版组件数量上的差异就好了,很明显。
开源免费版预览地址:https://form.making.link/basic-version/#/zh-CN/
image.png
商业授权版预览地址:https://form.making.link/sample/#/zh-CN/
image.png
一屏放不下,仅截取了部分。
而且,功能差异不仅仅在于组件的多少,而是API上也有限制,高级的API只能在商业授权版中使用。

form-create-designer

最后来说下,form-create-designer,这是最后发现的一款优秀的表单设计器,相比前面两款,比较特殊的一点是,还有个form-create的项目,实际是form-create-designer的最主要组成部分,因此下面数据把它也列上。
开源地址:https://gitee.com/xaboy/form-create-designer
开源协议:MIT
image.png
最后一次更新日期大概是一年前。

技术栈:多版本,既有vue2和Element UI的版本,也有vue3和Element Plus的版本,还支持其他UI库,如iView和Ant-design-vue
文档:有官网,文档看上去比较全面,http://www.form-create.com/v3/guide/
功能:比较全面,提供api与后端集成,组件可扩展

预览地址:http://form-create.com/v3/designer
image.png

技术选型

要进行技术选型,需要考虑多方面因素,最好的不一定是最适合的,最适合的才是最好的。
平台的主要技术栈是vue3+element plus,因此不支持该技术栈的form-generator首先就出局了,而且,一个无法跟后端集成的“纯”前端设计器,实用性也很有限。

FormMaking功能确实强大,但细分了版本,对于开源免费的基础版本,功能受限,实际影响不小。
反观form-create-designer,组件够用,提供api与后端集成,组件可扩展,缺点就是git指标比较低,使用者较少,遇到问题恐怕得自己摸索,很难百度到解决方案。

综上考虑,最终选择的form-create-designer。

开发平台资料

平台名称:一二三开发平台
简介: 企业级通用开发平台
设计资料:csdn专栏
开源地址:Gitee
开源协议:MIT
开源不易,欢迎收藏、点赞、评论。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/132091.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用JMeter进行接口压力测试

1.我首先创建一个线程组 2.创建好之后如图所示 3. 进行配置 4. 然后添加一个https请求 5.创建好之后设置请求方法和对应参数 6.设置表格监听器 7.创建好之后如图所示 8.保存jmx文件后点击运行进行测试,结果反馈如下图

【数智化人物展】觉非科技CEO李东旻:数据闭环,智能驾驶数智时代发展的新引擎...

李东旻 本文由觉非科技CEO李东旻投递并参与《2023中国企业数智化转型升级先锋人物》榜单/奖项评选。 大数据产业创新服务媒体 ——聚焦数据 改变商业 数智化的主要作用是帮助决策。它的核心是大数据,以大数据为基础,匹配合适的AI技术,促使数…

leetcode刷题 - SQL - 简单

目录 1. 175组合两个表 左外连接 2. 181. 超过经理收入的员工 3. 182. 查找重复的电子邮箱 4. 196. 删除重复的电子邮箱 5. 197. 上升的温度 日期作差 6. 511. 游戏玩法分析 I 7. 577. 员工奖金 null条件运算 8. 584. 寻找用户推荐人 9. 586. 订单最多的客户 10. 595. 大的国家…

AD9371 官方例程裸机SW 和 HDL配置概述(二)

AD9371 系列快速入口 AD9371ZCU102 移植到 ZCU106 : AD9371 官方例程构建及单音信号收发 ad9371_tx_jesd -->util_ad9371_xcvr接口映射: AD9371 官方例程之 tx_jesd 与 xcvr接口映射 AD9371 官方例程 时钟间的关系与生成 : AD9371 官方…

第四届辽宁省大学生程序设计竞赛(正式赛)(12/13)

AC情况 赛中通过赛后通过暂未通过A√B√C√D○E○F√G√H√I○J√K—L√M√ 整体体验 easy:ABFHL mid:MJGC hard:IDKE 心得 感觉出了一堆典题,少数题还有些意思,E题确实神仙 题解 A. 欢迎来到辽宁省赛&#x…

图解系列--查漏补缺

1. L2转发,L3转发 网络传输中,每个节点会根据分组数据的地址信息,来判断该报文应该由哪个网卡发送出去。为此,各个地址会参考一个发出接口列表。在这一点上 MAC 寻 址与IP 寻址是一样的。只不过MAC 寻址中所参考的这张表叫做地址…

【双指针+简化去重操作】Leetcode 15 三数之和

【双指针简化操作】Leetcode 15 三数之和 解法1 解法1 新建一个嵌套列表&#xff1a;List<List<Integer>> result new List<>(); 初始化一个ArrayList并直接赋值&#xff1a;ArrayList<Integer> result new ArrayList<>(Arrays.asList(1, 2…

又来安利了,这个Itbuilder在线数据库设计工具用起来太顺手了

对于测试、开发、DBA、运维来说&#xff0c;数据库是再熟悉不过了。 我们都知道如今的数据是多么复杂和难以管理&#xff0c;但幸运的是有数据库设计工具可以帮助我们&#xff0c;可以在市场上找到很多的数据库设计工具&#xff0c;包括itbuilder。这些数据库设计工具可以帮助我…

【Python语言】集合的使用方法总结

目录 1、集合基本知识&#xff1a; 2、定义 2.1 定义集合变量 2.2 定义空集合 3、集合的常用操作 3.1 定义集合 3.2 添加新元素 3.3 移除元素 3.4 从集合中随机取出元素 3.5 清空集合 3.6 取两个集合的差集 3.7 消除两个集合的差集 3.8 两个集合合并 3.9 统计集合…

任正非说:我们要在整体上形成海军陆战队和主力作战团队相配合的作战方案。

你好&#xff01;这是华研荟【任正非说】系列的第30篇文章&#xff0c;让我们聆听任正非先生的真知灼见&#xff0c;学习华为的管理思想和管理理念。 一、我们的业务量在增长&#xff0c;因此带来表面上人的效益是增长的。但是我们要看到&#xff0c;我们现在利润不是来自于管理…

改进YOLO系列:12.Repulsion损失函数【遮挡】

1. RepLoss论文 物体遮挡问题可以分为类内遮挡和类间遮挡两种情况。类间遮挡产生于扎堆的同类物体,也被称为密集遮挡(crowd occlusion)。Repulsion损失函数由三个部分构成,yolov5样本匹配,得到的目标框和预测框-一对应第一部分主要作用:预测目标框吸引IOU最大的真实目标框,…

2023辽宁省数学建模A题铁路车站的安全标线完整原创论文详细讲解(含matlab代码)

大家好呀&#xff0c;从发布赛题一直到现在&#xff0c;总算完成了辽宁省数学建模A题完整的成品论文。 本论文可以保证原创&#xff0c;保证高质量。绝不是随便引用一大堆模型和代码复制粘贴进来完全没有应用糊弄人的垃圾半成品论文。 B预计下午两点前更新完毕&#xff0c;A全…

Go类型嵌入介绍和使用类型嵌入模拟实现“继承”

Go类型嵌入介绍和使用类型嵌入模拟实现“继承” 文章目录 Go类型嵌入介绍和使用类型嵌入模拟实现“继承”一、独立的自定义类型二、继承三、类型嵌入3.1 什么是类型嵌入 四、接口类型的类型嵌入4.1 接口类型的类型嵌入介绍4.2 一个小案例 五、结构体类型的类型嵌入5.1 结构体类…

ElasticSearch 实现 全文检索 支持(PDF、TXT、Word、HTML等文件)通过 ingest-attachment 插件实现 文档的检索

一、Attachment 介绍 Attachment 插件是 Elasticsearch 中的一种插件&#xff0c;允许将各种二进制文件&#xff08;如PDF、Word文档等&#xff09;以及它们的内容索引到 Elasticsearch 中。插件使用 Apache Tika 库来解析和提取二进制文件的内容。通过使用 Attachment 插件&a…

vector模拟实现

vector的模拟实现 一. vector的模拟实现1.0 与string的区别1.1 实现内容实现方法 二. vector模拟中重点讲解内容&#xff08;坑&#xff09;2.1 erase的使用问题2.2 resize的特殊写法2.3 operator 2.4 reserve 三. 整体代码 一. vector的模拟实现 我们知道&#xff1a; 在STL中…

iPhoto照片垃圾清理工具CleanMyMacX2024

CleanMyMacX的照片垃圾清理功能会浏览您的iPhoto图片库&#xff0c;找到那些经过裁剪、调整大小、旋转或者其他编辑之后不再需要的但仍被iPhoto保存的原始图片副本。这些副本是隐藏的&#xff0c;但是它们却极大的增加了图片库的大小。 CleanMyMac X全新版下载如下: https://…

揭秘ChatGPT的智慧密码:向量数据库的神奇作用解析

2023年8月&#xff0c;亚马逊云科技推出了自己的向量引擎Amazon OpenSearch Serverless向量引擎&#xff0c;这被认为是其旗下大语言模型Amazon Titan超越ChatGPT的一个重要契机。 那么&#xff0c;这个Amazon OpenSearch Serverless向量引擎有何厉害之处&#xff1f;为什么能…

好用的MybatisX插件~

MybatisX插件&#xff1a; MyBatis-Plus为我们提供了强大的mapper和service模板&#xff0c;能够大大的提高开发效率。但是在真正开发过程中&#xff0c;MyBatis-Plus并不能为我们解决所有问题&#xff0c;例如一些复杂的SQL&#xff0c;多表联查&#xff0c;我们就需要自己去…

二十、泛型(1)

本章概要 基本概念 与 C 的比较 简单泛型 一个元组类库一个堆栈类RandomList 基本概念 普通的类和方法只能使用特定的类型&#xff1a;基本数据类型或类类型。如果编写的代码需要应用于多种类型&#xff0c;这种严苛的限制对代码的束缚就会很大。 多态是一种面向对象思想的泛…

2-爬虫-代理池搭建、代理池使用(搭建django后端测试)、爬取某视频网站、爬取某视频网站、bs4介绍和遍历文档树

1 代理池搭建 2 代理池使用 2.1 搭建django后端测试 3 爬取某视频网站 4爬取某视频网站 5 bs4介绍和遍历文档树 1 代理池搭建 # ip代理-每个设备都会有自己的IP地址-电脑有ip地址---》访问一个网站---》访问太频繁---》封ip-收费&#xff1a;靠谱稳定--提供api-免费&#xff…