动态表单开源库

10月前作者：即将头秃的程序媛分类：Toy博客阅读(28) 违法举报

这篇具有很好参考价值的文章主要介绍了动态表单开源库。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.Form Making

代码仓库

GitHub - GavinZhuLei/vue-form-making: A visual form designer/generator base on Vue.js, make form development simple and efficient.（基于Vue的可视化表单设计器，让表单开发简单而高效。）

演示DEMO
可视化低代码表单设计器 - FormMaking

2.Form Generator

代码仓库
GitHub - JakHuang/form-generator: Element UI表单设计及代码生成器

码云
form-generator: Element UI表单设计及代码生成器

演示DEMO
form-generator

3.Form Create

代码仓库
https://github.com/xaboy/form-create

码云
https://gitee.com/xaboy/form-create/

演示DEMO
http://jeekweb.pro/form-create-demo/#/
https://jsrun.net/NQhKp/edit

4.k-form-design

代码仓库
GitHub - Kchengz/k-form-design: 基于vue Ant-Design 的表单设计器，快速开发
码云
k-form-design: 基于vue Ant-Design 的表单设计器，快速开发

演示DEMO
表单设计器kcz

5.vue-form-design

代码仓库
GitHub - jjxliu306/ng-form-element: 动态表单，VUE动态表单。基于vue+elementui实现动态表单组件，通过拖拽组件到面板即可实现一个表单。支持各个组件的动态隐藏显示，动态表格弹窗式维护。致力打造开源最强vue动态表单组件，持续维护。

码云
jjxliu306/vue-form-design文章来源地址https://www.toymoban.com/news/detail-482529.html

到了这里，关于动态表单开源库的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

element UI —— form表单中Radio单选框进行切换 & 表单验证rule动态校验-validator & 保存前进行form表单校验后才能上传-validate

element UI —— form表单中Radio单选框进行切换表单验证rule动态校验-validator 保存前进行form表单校验后才能上传-validate 1、效果图 2、代码结构数据

2024年02月07日
浏览(53)
el-form表单动态校验(场景: 输入框根据单选项来动态校验表单没有选中的选项就不用校验)

el-form常规校验方式: 正题部分-表单动态校验场景: 输入框根据单选项来动态校验表单没有选中的选项就不用校验效果: 关键点: 跟正常校验流程不同的是, el-form-item标签内的required和rules都要加上判断条件

2024年02月09日
浏览(54)
Element Plus Form 动态表单自定义校验规则使用教程

Element Plus，基于 Vue 3，面向设计师和开发者的组件库 Element Plus 官网：https://element-plus.org/zh-CN/ Element Plus Form 动态表单自定义效验规则，官网示例代码中没有，官网示例中的动态表单是固定的规则，本文讲解动态表单自定义规则的使用目录 1、官网动态表单示例代码 2、表单自

2024年01月18日
浏览(52)
lp-vant-form微信小程序动态表单

lp-vant-form 是一个可以通过 JSON 生成具有动态渲染、数据收集、验证和提交功能的表单生成组件。依赖 Vant Weapp UI 组件库通过 JSON 生成表单支持数据联动数据验证数据处理内置组件 input picker date upload address 通过 JSON 快速的配置表单项规则。内置多种场景、功能的表单组件

2024年02月03日
浏览(44)
element-ui form表单的动态rules校验

在vue 项目中，有时候可能会用到element-ui form表单的动态rules校验，比如说选择了哪个选项，然后动态显示或者禁用等等。我们可以巧妙的运用element-ui form表单里面form-item想的校验规则来处理（每一个form-item项都可以单独校验）。上代码：重点是这个： :rules=“sqyxForm.jtpslx

2024年02月15日
浏览(52)
【element-ui】form表单动态修改rules校验项

在项目开发过程中，该页面有暂存和提交两个按钮，其中暂存和提交必填项校验不一样，此时需要动态增减必填项校验，解决方法如下：增加rules校验项删除rules校验项

2024年02月04日
浏览(60)
在react antd中动态生成多个 form表单组，包括一个动态添加/删除表单项的功能和一个提交表单的功能

在这个示例中，我们首先使用 Form.useForm() 创建一个表单实例。接着，我们使用 Form.List 组件来动态生成多个表单项。在 Form.List 组件中，我们使用 fields.map 方法循环渲染每个表单项，并使用 Form.Item 组件包裹每个表单项。在 Form.Item 组件中，我们使用 label 属性指定标签，使用

2024年02月15日
浏览(58)
vue3 antd项目实战——Form表单的提交与校验【v-model双向绑定input输入框、form表单数据，动态校验规则】

本文依旧沿用 ant design vue 组件库和 ts 语言🔥🔥更多内容见Ant Design Vue官方文档 🔥🔥 vue3 antd项目实战——Form表单【后台管理系统 v-model数据的双向绑定，input输入框、Radio单选框的嵌套使用】在上期文章中，我们完成了 UI界面的渲染（渲染效果如下图），本期文章将带着大

2023年04月22日
浏览(85)
el-form 动态表单增减项（vue+element ui）

1、点击”+“，弹出弹窗，新增一项，点击”-“，删除当前项代码展示： html代码：注意： el-form-item（表单项）循环，绑定的数组写在form当中表单：新增参数弹框： data: methods： 1、点击新增，弹出新增弹窗，添加表单项 2、点击”-“，删除当前表单项

2024年02月02日
浏览(52)
Vue+Element-UI el-form表单动态检验

业务需求：表单el-form 有一表单项：发布时间，有5个选项：今天、24小时、近3天、近7天和自定义时间，其中当选择自定义时间时，后面跟着的日期时间选择器是必填的，选中其他选项时则不需要。这就需要做到表单的动态检验。最开始实现方式是在当前表单项中设置规则

2024年02月11日
浏览(57)