This action will force synchronization from xaboy/form-create, which will overwrite any changes that you have made since you forked the repository, and can not be recovered!!!
Synchronous operation will process in the background and will refresh the page when finishing processing. Please be patient.
具有动态渲染,数据收集,验证和提交功能的表单生成器,内置17种常用表单组件,支持双向数据绑定,事件扩展,并支持使用json生成内置组件和任何vue组件。
如果对您有帮助,您可以点右上角 "Star" 支持一下 谢谢!本项目还在不断开发完善中,如有任何建议或问题请在这里提出 本项目QQ讨论群28963712
文件名 | 说明 |
---|---|
form-create.js | iViewUI 版本 |
form-create.elm.js | ElementUI 版本 |
CRMEB客户管理+电商管理系统 (演示站 账号:demo 密码:crmeb.com)
npm install form-create
CDN:
iviewUI
<!-- import Vue.js -->
<script src="//vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" href="//unpkg.com/iview/dist/styles/iview.css">
<!-- import iView -->
<script src="//unpkg.com/iview/dist/iview.min.js"></script>
<!-- import form-create/iview -->
<script src="//unpkg.com/form-create/dist/form-create.min.js"></script>
elementUI
<!-- import Vue.js -->
<script src="//vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- import element -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<!-- import form-create/element -->
<script src="//unpkg.com/form-create/dist/form-create.elm.min.js"></script>
NodeJs:
iviewUI
import formCreate from 'form-create'
import { maker } from 'form-create'
Vue.use(formCreate)
ElementUI
import formCreate from 'form-create/element'
import { maker } from 'form-create/element'
Vue.use(formCreate)
<form-create ref="fc" v-model="fApi" :rule="rule" :option="option"></form-create>
NodeJs
import {maker} from 'form-create'
export default {
data () {
return {
fApi:{},
model: {},
//表单生成规则
rule:[
maker.input('商品名称','goods_name'),
maker.date('创建时间','created_at')
],
//组件参数配置
option:{
//表单提交事件
onSubmit:function (formData) {
alert(JSON.stringify(formData));
}
}
};
},
mounted:function(){
this.model = this.fApi.model();
}
};
Browser
new Vue({
el:'#app1',
data:{
fApi:{},
model: {},
rule:[
formCreate.maker.input('商品名称','goods_name'),
formCreate.maker.date('创建时间','created_at')
],
option:{
onSubmit:function (formData) {
alert(JSON.stringify(formData));
}
}
},
mounted:function () {
this.model = this.fApi.model();
}
});
时光弧线 | wxxtqk | williamBoss | HeyMrLin | djkloop
Copyright (c) 2018-present xaboy
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。