File 文件

File 文件

如何选择 file 和 originfile 类型

file 适合文件上传是单独的接口，独立于表单
originfile 用于表单内文件上传需要通过二进制的方式根据表单一起提交上传，originfile 需要设置 contentType 为 multipart 才能正常上传

在线实验室

参数列表

参数	说明	可选值 \| 类型	必填

type	field类型	string	是
label	标签文本	string	否
ctx	编辑态为edit，展示态为view，不配置则使用当前block的ctx	"edit" \| "view"	否
default	可以设置默认值	string	否
labelWidth	在form和object内生效，可单独指定当前field的标签文本所占的宽度	string	否
info	如配置会在标签处展示tooltip提示	string	否
desc	如配置会在ctx为edit状态下固定显示在表单项下面	string	否
hidden	默认为false，配置为true则改表单项会隐藏	null \| boolean	否
show	配置后只有满足指定的条件后才显示，实现对目标条件的依赖联动	string \| object \| function	否
show.name	目标字段名	string	否
show.value	目标字段值	string \| number	否
rules	可以配置多条校验规则，会在form的编辑态通过@validate来校验，详见 https://github.com/yiminghe/async-validator	null \| array	否
rules[]		object	否
rules[].require	是否必填	boolean	否
rules[].type	校验类型	"string" \| "number" \| "boolean" \| "method" \| "regexp" \| "integer" \| "float" \| "array" \| "object" \| "enum" \| "date" \| "url" \| "hex" \| "email"	否
props	action为上传接口地址	null \| object	否
successUrlKey	调用action上传接口成功后会通过该路径去获取url值	string	否
tip	固定显示的tip	string	否

示例预览

表单展示状态

表单编辑状态

示例代码

file: {
    type: 'file',
    label: '文件上传',
    tip: '只能上传jpg/png文件，且不超过500kb',
    successUrlKey: 'url',
    props: {
        action: 'https://jsonplaceholder.typicode.com/posts/'
    }
}

组件更多配置可参考Element：Upload 上传中的Attributes