form create designer

官網|幫助文檔|在線演示|移動端在線演示| FormCreate 文檔

FormCreate 低代碼表單設計器

@form-create/designer是基於@form-create/element-ui 和ElementPlus 實現的低代碼表單設計器組件。支持Vue2和Vue3

@form-create/vant-designer是基於@form-create/vant 和Vant 實現的移動端低代碼表單設計器組件。支持Vue3

特點

• 使用JSON數據生成表單
• 支持擴展自定義組件
• 內置30+常用的表單組件和佈局組件
• 提供豐富的表單操作API
• 支持子表單和分組
• 支持事件配置
• 支持樣式配置
• 支持表格佈局
• 支持表單驗證
• 支持表單多語言

支持的UI框架

如果對您有幫助，您可以點右上角"Star"支持一下謝謝！本項目還在不斷開發完善中,如有任何建議或問題請在這裡提出

開發者討論群629709230

• 預覽

PC端設計器

CDN:

 < link rel =" stylesheet " href =" https://unpkg.com/element-plus/dist/index.css " > </ link >
< script src =" https://unpkg.com/vue " > </ script >
< script src =" https://unpkg.com/element-plus/dist/index.full.js " > </ script >
< script src =" https://unpkg.com/@form-create/element-ui@next/dist/form-create.min.js " > </ script >
< script src =" https://unpkg.com/@form-create/designer@next/dist/index.umd.js " > </ script >

NodeJs:

npm install @form-create/designer@next
npm install @form-create/element-ui@next
npm install element-plus

 import FcDesigner from '@form-create/designer'
import ELEMENT from 'element-plus' ;
import 'element-plus/dist/index.css' ;

app . use ( ELEMENT ) ;
app . use ( FcDesigner )
app . use ( FcDesigner . formCreate )

使用

 < fc-designer ref =" designer " /> 

移動端設計器

CDN:

 < link rel =" stylesheet " href =" https://unpkg.com/element-plus/dist/index.css " > </ link >
< link rel =" stylesheet " href =" https://unpkg.com/vant@4/lib/index.css " />
< script src =" https://unpkg.com/vue " > </ script >
< script src =" https://unpkg.com/element-plus/dist/index.full.js " > </ script >
< script src =" https://unpkg.com/vant@4/lib/vant.min.js " > </ script >
< script src =" https://unpkg.com/@form-create/element-ui@next/dist/form-create.min.js " > </ script >
< script src =" https://unpkg.com/@form-create/vant@next/dist/form-create.min.js " > </ script >
< script src =" https://unpkg.com/@form-create/vant-designer@next/dist/index.umd.js " > </ script >

NodeJs:

npm install @form-create/vant-designer@next
npm install @form-create/element-ui@next
npm install @form-create/vant@next
npm install element-plus
npm install vant

 import FcDesignerMobile from '@form-create/vant-designer'
import ELEMENT from 'element-plus' ;
import vant from 'vant' ;
import 'vant/lib/index.css' ;
import 'element-plus/dist/index.css' ;

app . use ( ELEMENT )
app . use ( vant )
app . use ( FcDesignerMobile )
app . use ( FcDesignerMobile . formCreate )

使用

 < fc-designer-mobile ref =" designer " /> 

聯繫

License

MIT

Copyright (c) 2021-present xaboy