首页 > 其他分享 >推荐几个开源的vue表单设计器

推荐几个开源的vue表单设计器

时间:2024-07-12 17:08:39浏览次数:13  
标签:vue Form JSON 表单 开源 Vue io 组件

1、Form.io

Form.io是一个开源的纯JavaScript表单渲染器和API平台,为开发者提供了一种快速、灵活的方式来构建和管理表单驱动的应用程序。Form.io使用ES6和JavaScript实现(没有jQuery、Angular、React或任何其他框架依赖),将JSON模式渲染为web form表单,并将该表单挂接到Form.io 服务的Complete Form Builder上,该Builder创建用于渲染表单的JSON模式。 Form.io支持嵌套组件、布局、日期/时间、选择、输入框等多种web组件,提供了Form.io完整JavaScript API SDK库,Form.io提供了直观的拖放界面,允许开发者无需编写大量代码即可创建和定制表单布局和字段结构。Form.io可以轻松地与各种前端框架(如React、Angular、Vue等)以及后端技术栈集成,并提供了angular-formio、react-formio、vue-formio等sdk库。开源流程引擎camunda的表单功能就是采用了Form.io表单组件。

1-formio

https://formio.github.io/formio.js/app/builder

2、FormMaking

FormMaking基于 Vue 的可视化表单设计器,赋能企业实现低代码开发模式;帮助开发者从传统枯燥的表单代码中解放出来,更多关注业务,快速提高效率,节省研发成本。FormMaking支持创建 Element 和 Ant Design 风格,最新的前端技术栈,支持 Vue2 / Vue3,内置了 i18n 国际化解决方案,方便二次开发,支持 pc、pad、mobile 多终端布局适配,并可查看展示效果。FormMaking既有开源版也有商业版本。

http://form.making.link/

3、Variant Form

VForm是一款基于Vue 2/Vue 3的低代码表单,支持Element UI、iView两种UI库,定位为前端开发人员提供快速搭建表单、实现表单交互和数据收集的功能。

VForm 3是一款基于Vue 3.x的低代码表单,支持Element PlusUI库,定位为前端开发人员提供快速搭建表单、实现表单交互和数据收集的功能。VForm 3全称为Variant Form 3,寓意为灵活的、动态的、多样化的Vue 3.x低代码表单。VForm 3由表单设计器VFormDesigner和表单渲染器VFormRender两部分构成,VFormDesigner通过拖拽组件方式生成JSON格式的表单对象,VFormRender负责将表单JSON渲染为Vue组件。FormMaking既有开源版也有商业版本。

https://www.vform666.com/

4、k-form-design

基于vue2和ant-design-vue实现的表单设计器,样式使用less作为开发语言,主要功能是能通过简单操作来生成配置表单,生成可保存的JSON数据,并能将JSON还原成表单,使表单开发更简单更快速。

https://kcz66.gitee.io/k-form-design/#/

5、form-create

form-create 是一个可以通过 JSON 生成具有动态渲染、数据收集、验证和提交功能的表单生成组件。支持3个UI框架(ElementUIIview/View-designAnt-design-vue),并且支持生成任何 Vue 组件。内置20种常用表单组件和自定义组件,再复杂的表单都可以轻松搞定。

http://designer.form-create.com/

云程表单设计器

表单设计器是云程低代码平台的核心组件,是一款在线可视化表单建模工具,采用了直观的拖放式界面,使得用户无需深入编程即可设计复杂的表单布局,提供了vue2和vue3版本,支持ElementUIAnt-design-vue两种UI框架,支持国际化多语言配置功能。

表单设计器提供了表单引擎的功能,适用于各种应用场景,包括但不限于OA、ERP、MES、CRM、HR等业务系统使用。表单设计器跟数据实体模型、数据ER模型无缝集成,支持单表、主子表、一对一、一对多等复杂数据模型,可基于数据ER模型一键生成表单。表单设计器实现了跟开源工作流引擎的无缝集成整合,支持流程中设计表单、配置表单权限、流程表单审批等应用。并提供了详细的在线文档、学习视频等教程,帮助用户快速上手并熟练使用表单设计器和低代码开发功能。

6-云程表单设计器

在线体验:http://www.yunchengxc.com

标签:vue,Form,JSON,表单,开源,Vue,io,组件
From: https://www.cnblogs.com/hibpm/p/18298961

相关文章

  • 从0到1开始搭建vue2+element ui 后台管理系统
    一、前期准备(如果已搭建的可以往下看)1.安装node(node-v查询版本号)(下载地址:https://nodejs.org/en/download/)2. 安装淘宝镜像命令: npminstall-gcnpm--registry=https://registry.npmmirror.com  3.安装webpack,以全局的方式安装命令:npminstallwebpack-g4......
  • WPF开源的一款免费、开箱即用的翻译、OCR工具
    思维导航前言WPF介绍工具快捷键工具下载工具部分功能截图项目源码地址优秀项目和框架精选DotNetGuide技术社区交流群前言今天大姚给大家分享一款由WPF开源的、免费的(MITLicense)、即开即用、即用即走的翻译、OCR工具:STranslate。WPF介绍WPF是一个强大的桌面应......
  • 第二部分:关键技术领域的开源实践【操作系统】
    操作系统:Linux及其他开源选项放眼当下的计算机产业,在服务器市场和云市场LinuxOS都占据统治地位,其中占比最高的CentOS在政务、电信、金融、能源、互联网等行业被广泛应用,而且很多国内的Linux操作系统商业发行版也大多依托于CentOS项目发展。但是,大家都知道,Cent0s6已于20......
  • vue3前端项目结构解析(2024-07-12)
    .├──build#打包脚本相关│  ├──config#配置文件│  ├──generate#生成器│  ├──script#脚本│  └──vite#vite配置├──mock#mock文件夹├──public#公共静态资源目录├──src#主目录│  ├──api#接口......
  • vue3项目中浏览器打开本地文档或者下载本地应用的方法(2024-07-11)
    在public文件夹下面加入预览的文件【操作说明文档】。public文件夹包含了应用程序的入口HTML文件,以及其他不需要经过编译的静态文件此文件夹不会压缩并且路径不变,所以是最佳的存放文件的位置。代码:<template><n-icontitle="操作文档"style="cursor:pointer;margin-......
  • 适用于react、vue菜单格式化工具函数
    场景在一个动态菜单场景中,你向接口获取树形菜单,但最后拿到的树未能达到你的预期,这个时候就需要手写递归重新处理这颗树适用于react、vue菜单格式化工具函数包含功能1.当前路由是否存在返回按钮判断逻辑:只要存在左侧可点击的菜单都不具备返回按钮,其他则具有返回按钮2.错误......
  • ScreenToGif:一款开源免费且好用的录屏转Gif软件
    ScreenToGif介绍GitHub上的介绍:此工具允许您记录屏幕的选定区域、来自网络摄像头的实时提要或来自草图板的实时绘图。之后,您可以编辑动画并将其保存为gif、apng、视频、psd或png图像。在平常写公众号的过程中,经常有录屏转Gif的需求,我就是使用ScreenToGif做的。在截止写这......
  • 前端使用 Vue 3,后端使用 Spring Boot 构建 Hello World 程序
    前端使用Vue3,后端使用SpringBoot构建HelloWorld程序前端(Vue3)首先,创建一个Vue3项目。1.安装VueCLInpminstall-g@vue/cli2.创建Vue项目vuecreatefrontend在交互式提示中,选择默认的Vue3预设。3.修改App.vue在frontend/src目录下,修改......
  • 基于SpringBoot+Vue+数据可视化的药品商场购物系统设计和实现(源码+LW+部署讲解)
    博主介绍:✌全网粉丝50W+,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流✌技术范围:SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、P......
  • 毕业设计-基于Springboot+Vue的招生管理系统的设计与实现(源码+LW+包运行)
    源码获取:https://download.csdn.net/download/u011832806/89456200基于SpringBoot+Vue的招生管理系统开发语言:Java数据库:MySQL技术:SpringBoot+MyBatis+Vue.js工具:IDEA/Ecilpse、Navicat、Maven系统演示视频:链接:https://pan.baidu.com/s/1GwKRBbuwMiZmnxkvRN9VJg?pwd=sb......