表单自动生成器form( 五 )


在表单尾部追加一个 input 组件
rules.push({type:"input",title:"商品简介",field:"goods_info",value:"",props: {"type": "text","placeholder": "请输入商品简介",},validate:[{ required: true, message: '请输入商品简介', trigger: 'blur' },],})
删除表单字段
删除指定字段
$f.removeField(field);
删除最后一个字段
rules.pop()
隐藏指定字段 $f.(true, field) 根据后台返回的规则生成表单
fetch('api').then(rule=>{$f = formCreate.create(rule,{onSubmit(formData){// 表单提交事件$f.btn.loading(true);//TODO 提交表单}})})
隐藏默认提交按钮
设置全局配置. = false即可隐藏
定制默认提交按钮
option: {submitBtn: {type: "basic",size: "mini",icon: "",shape: "round",innerText: "submit",col: {span: 4,offset: 10}}}
显示默认重置按钮
设置全局配置. = true即可显示
Vue 版本不支持

表单自动生成器form

文章插图
获取 $f参考
在配置项中调用外层组件的方法参考 #51
规则正在其他form-中使用
一个生成规则rule只能同时在一个中使用. 如果需要多次使用:
验证规则无效
请注意 value 的数据类型.如果组件为多选或区间选择时 value 的数据类型为Array,需要在验证规则中设置type:'array'
验证规则说明
组件不显示
将 slot 配置项配置在 props 中
props: {"trueValue":"1", "falseValue":"0","slot": {open:"上架", close:"下架", }, }
修改组件值后页面没有更新
【表单自动生成器form】在表单创建后到成功渲染之前修改是无效的