全局配置

该文档不再维护,新版文档地址:form-create 文档


全局配置由一下7个部分组成

  1. el 表单插入的节点,
  2. form 表单整体布局配置
  3. row 表单组件布局配置 [参考iview栅格布局](https://www.iviewui.com/components/grid\)
  4. upload upload组件全局配置
  5. submitBtn 提交按钮样式配置
  6. resetBtn 重置按钮样式配置
  7. onSubmit 表单提交事件

完整配置

{
    //插入节点,默认document.body
    el:null,

    //form配置
    form:{

        //是否开启行内表单模式
        inline:false,
        //表单域标签的位置,可选值为 left、right、top
        labelPosition:'right',
        //表单域标签的宽度,所有的 FormItem 都会继承 Form 组件的 label-width 的值
        labelWidth:125,
        //是否显示校验错误信息
        showMessage:true,
        //原生的 autocomplete 属性,可选值为 off 或 on
        autocomplete:'off',

    },

    //row布局配置
    row:{

        //栅格间距,单位 px,左右平分
        gutter:0,
        //布局模式,可选值为flex或不选,在现代浏览器下有效
        type:undefined,
        //flex 布局下的垂直对齐方式,可选值为top、middle、bottom
        align:undefined,
        //flex 布局下的水平排列方式,可选值为start、end、center、space-around、space-between
        justify:undefined,
        //自定义的class名称
        className:undefined

    },

    //上传组件全局配置
    upload:{

        //上传文件之前的钩子,参数为上传的文件,若返回 false 或者 Promise 则停止上传
        beforeUpload:()=>{},
        //文件上传时的钩子,返回字段为 event, file, fileList
        onProgress:(event, file, fileList)=>{},
        //文件上传成功时的钩子,返回字段为 response, file, fileList,若需有把文件添加到文件列表中,在函数值返回即可
        onSuccess:(response, file, fileList)=>{
            // return 'filePath';
        },
        //文件上传失败时的钩子,返回字段为 error, file, fileList
        onError:(error, file, fileList)=>{},
        //点击已上传的文件链接时的钩子,返回字段为 file, 可以通过 file.response 拿到服务端返回数据
        onPreview:(file)=>{},
        //文件列表移除文件时的钩子,返回字段为 file, fileList
        onRemove:(file, fileList)=>{},
        //文件格式验证失败时的钩子,返回字段为 file, fileList
        onFormatError:(file, fileList)=>{},
        //文件超出指定大小限制时的钩子,返回字段为 file, fileList
        onExceededSize:(file, fileList)=>{},
        //辅助操作按钮的图标 ,设置为false将不显示
        handleIcon:'ios-eye-outline',
        //点击辅助操作按钮事件
        onHandle:(src)=>{},
        //是否可删除,设置为false是不显示删除按钮
        allowRemove:true,

    },

    //表单提交事件
    onSubmit:(formData)=>{},

    //提交按钮配置,设置submitBtn=false或submitBtn.show=false时不显示按钮
    submitBtn:{

        //按钮类型,可选值为primary、ghost、dashed、text、info、success、warning、error或者不设置
        type:"primary",
        //按钮大小,可选值为large、small、default或者不设置
        size:"large",
        //按钮形状,可选值为circle或者不设置
        shape:undefined,
        //开启后,按钮的长度为 100%
        long:true,
        //设置button原生的type,可选值为button、submit、reset
        htmlType:"button",
        //设置按钮为禁用状态
        disabled:false,
        //设置按钮的图标类型
        icon:"ios-upload",
        //按钮文字提示
        innerText:"提交",
        //设置按钮为加载中状态
        loading:false,
        //默认显示
        show:true

    },

    //重置按钮默认配置,设置resetBtn=true或resetBtn.show=true时显示
    resetBtn:{

        type:"ghost",
        size:"large",
        shape:undefined,
        long:true,
        htmlType:"button",
        disabled:false,
        icon:"refresh",
        innerText:"重置",
        loading:false,
        //默认不显示
        show:false

    }
}

results matching ""

    No results matching ""