vue-ele-form-generator | vue-ele-form 的表单设计器
介绍
vue-ele-form-generator 是专为 vue-ele-form 开发的可视化表单设计工具, 并且支持vscode 插件、cli 本地启动、在线设计多种方式, 让表单开发的效率更上一层楼!
注意
注意，此设计器不是独立存在的，是依托于 vue-ele-form，在使用前请务必阅读 vue-ele-form 的文档。
特性
- 提供vscode 插件更贴近日常开发
- 可视化配置页面
- 提供
vue-ele-form全部基础组件 和 全部扩展组件 - 支持组件属性点选配置
- 支持本地启动, 告别被墙的痛苦
- 服务器保存, 应用到项目
- 基于项目的多表单管理, 省去二次开发
- 数据持久化(刷新依然存在)
- 一键生成配置 json 数据
- 一键生成.vue 格式内容
QA & Wiki
如何部署到服务器？
请参考文章 部署到服务器
二次开发
项目集成
安装 和 使用
第一步: 项目安装 vue-ele-form
本可视化项目是专为 vue-ele-form 组件开发的表单设计器, 如果想要在项目中使用生成的代码, 必须安装 vue-ele-form 组件, 点击查看;
第二步: 使用可视化设计表单
第一种方式: 在线设计地址(有点慢, 请耐心)
- **: https://dream2023.gitee.io/vue-ele-form-generator/
- 其它地区(online): https://vue-ele-form-generator.netlify.com/
第二种方式: 本地启动
# 安装
yarn global add fgen-cli # 或 npm install -g fgen-cli# 基本使用
fgen# 指定端口
fgen -p 8080# 更新
yarn global add fgen-cli # 或 npm update -g fgen-cli第三种方式: Docker 启动
docker pull chaojie1234/fgen
docker run -d --name=fgen -p 54321:80 chaojie1234/fgen生态
| Project | Status | Description |
|---|---|---|
| vue-ele-form |  |
接基于 ElementUI 的数据驱动表单 |
| vue-ele-form-generator |  |
专为 vue-ele-form 开发的可视化表单设计工具 |
| fgen-cli |  |
本地启动 vue-ele-form-generator 的 cli 工具 |
| fgen-for-vscode |  |
vue-ele-form-generator 的 vscode 扩展 |
| vue-ele-form-json-editor |  |
JSON 编辑器(vue-ele-form 扩展) |
| vue-ele-form-upload-file |  |
upload 文件上传组件(vue-ele-form 扩展) |
| vue-ele-form-image-uploader |  |
上传图片增强组件(vue-ele-form 扩展) |
| vue-ele-form-tree-select |  |
树形选择框组件(vue-ele-form 扩展) |
| vue-ele-form-table-editor |  |
表格编辑器(vue-ele-form 扩展) |
| vue-ele-form-dynamic |  |
动态表单(vue-ele-form 扩展) |
| vue-ele-form-video-uploader |  |
上传视频增强组件(vue-ele-form 扩展) |
| vue-ele-form-quill-editor |  |
富文本编辑器(vue-ele-form 扩展) |
| vue-ele-form-markdown-editor |  |
markdown 编辑器(vue-ele-form 扩展) |
| vue-ele-form-bmap |  |
百度地图组件(vue-ele-form 扩展) |
| vue-ele-form-codemirror |  |
代码编辑器(vue-ele-form-gallery 扩展) |
| vue-ele-form-gallery |  |
图片/视频展示组件(vue-ele-form 扩展) |
特别感谢赞助者
优客服
|
圣捷远创
|
damonnie
|
xzusoft
|
如果您觉得对您有所帮助, 可以请作者喝一杯咖啡, 让开源走的更远, 点击进入码云赞赏一下, 并加入下面交流群, 将链接发送给我
交流群
Contributors ✨
Thanks goes to these wonderful people (emoji key):
 张超杰 |
 Wisen 💻 |
 IWANABETHATGUY |
This project follows the all-contributors specification. Contributions of any kind welcome!