前段时间有分享一个基于ElementUI可视化表单生成器。今天继续给大家分享一款优秀的表单设计器AvueFormDesign。
avue-form-design基于Avue构建的多功能表单设计器。拖拽式操作让您快速制作一个FORM表单。
安装依赖
$npmielement-ui-S$npmi@smallwei/avue-S
安装表单组件
$npmi@sscfaith/avue-form-design-S
使用组件
templatedivid="app"avue-form-designstyle="height:100vh;":options="options":aside-left-width="275":aside-right-width="360"storage@submit="handleSubmit"/avue-form-design/div/templatescriptimportAvueFormDesignfrom'@sscfaith/avue-form-design'exportdefault{components:{AvueFormDesign},data(){return{}},methods:{//生成json回调handleSubmit(data){(data)}}}/script如果需要用到富文本编辑器，需要安装依赖avue-plugin-ueditor。
importAvueUeditorfrom'avue-plugin-ueditor'(AvueUeditor)
属性
options字段配置
表单预览效果
表单生成JSON
生成JSON代码编辑器基于ACE，可对代码进行格式化、压缩、排序、筛选等操作。
最后附上示例及项目地址
#预览地址
好了，就介绍到这里。如果小伙伴们有其它优秀的表单设计器，欢迎交流讨论！
文章版权声明：除非注明，否则均为虚境探索者原创文章，转载或复制请以超链接形式并注明出处。