我们在做项目过程中,要制作各种各样的表单,尤其是做后台管理系统,有大量的重复工作,今天大叔给大家推荐一款高效的 Vue 低代码表单工具 -- Variant Form。
Variant Form 是一个基于 Vue 和 Element UI 的高级表单组件,定位为前端开发人员提供快速搭建表单、实现表单交互和数据收集的功能。
安装依赖
npm install --registry=https://registry.npm.taobao.org
启动项目
npm run serve
确定表单布局
选择合适的容器进行组合:栅格Grid、表格Table、标签页Tab、子表单SubForm
选择表单组件
拖放合适的字段组件放置于容器中,并对字段组件命名,确保组件名称在当前表单中唯一
设置组件属性
设置字段组件属性或表单全局属性
设置组件样式
添加表单自定义样式,并在组件中应用自定义样式
处理组件交互逻辑
选择合适的组件事件,编写交互处理逻辑代码
导出表单代码
导出表单代码应用于VFormRender组件,也可直接导出 Vue 代码。
https://gitee.com/vdpadmin/variant-form
Variant Form是一款基于Vue 2/Vue 3的低代码表单,提供了丰富的表单组件、表单交互事件和API方法,可视化设计开发,快速生成代码,节省开发时间,有兴趣的伙伴赶快试试吧~
问君能有几多愁,开源项目解千愁,我们下期再见!