Upload 上传

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

上传元素类型 type: upload

accept 文件类型

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept

Icon

https://www.iviewui.com/components/icon

举例:
{
        type: "upload",
        field: "pic",
        title: "轮播图",
        value: [
            'http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg',
            'http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg'
            ],
        props: {
            "type":"select",
            "uploadType":"image",
            "action": "/upload.php",
            "name":"pic", 
            "multiple": true,
            "accept":"image\/*",
            "format":["jpg","jpeg","png","gif"], 
            "maxSize":2048, 
            "maxLength":5,
            "onSuccess":function (res) {
                return res.data.filePath;
            },
            handleIcon:'ionic',
            onHandle:(src)=>{alert(src);},
        },
    }
maker快速生成:
$formCreate.maker.upload('轮播图','pic',['http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg'])
        .props({
            "action": "",
            "maxLength": 4,
            "multiple": true,
            "type": "select",
            "uploadType": "image",
            "name": "file",
            "onSuccess": function () {
                return 'http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg';
            },
        })
        .validate([{required:true, type: 'array', min: 3, message: '请上传3张图片', trigger: 'change'}])
基本规则 rule:
字段名 说明 字段类型 是否必填 默认值
type 元素类型 String true -
field 字段名称 String true -
title 字段别名 String true -
value 字段值,当props.maxLength等与1时值为字符串,大于1时值为数组 String,Array false -
props 元素配置 Object true -
validate 验证规则 Array false -

元素配置 props:
字段名 说明 字段类型 是否必填 默认值
type 上传控件的类型，可选值为 select（点击选择），drag（支持拖拽） String true -
uploadType 上传文件类型，可选值为 image（图片上传），file（文件上传） String true -
action 上传的地址 String true -
name 上传的文件字段名 String false -
data 上传时附带的额外参数 Object false -
headers 设置上传的请求头部 Object false -
multiple 是否支持多选文件 Boolean false false
withCredentials 支持发送 cookie 凭证信息 Boolean false false
accept 接受上传的文件类型 String false -
format 支持的文件类型，与 accept 不同的是，format 是识别文件的后缀名，accept 为 input 标签原生的 accept 属性，会在选择文件时过滤，可以两者结合使用 String false -
maxSize 文件大小限制，单位 kb Number false -
maxLength 可上传文件数量 Number false -
beforeUpload 上传文件之前的钩子，参数为上传的文件，若返回 false 或者 Promise 则停止上传 Function false -
onProgress 文件上传时的钩子，返回字段为 event, file, fileList Function false -
onSuccess 文件上传成功时的钩子，返回字段为 response, file, fileList,若需有把文件添加到文件列表中,在函数返回值即可 Function true -
onError 文件上传失败时的钩子，返回字段为 error, file, fileList Function false -
onPreview 点击已上传的文件链接时的钩子，返回字段为 file， 可以通过 file.response 拿到服务端返回数据 Function false -
onRemove 文件列表移除文件时的钩子，返回字段为 file, fileList Function false -
onFormatError 文件格式验证失败时的钩子，返回字段为 file, fileList Function false -
onExceededSize 文件超出指定大小限制时的钩子，返回字段为 file, fileList Function false -
handleIcon 辅助操作按钮的图标 ,设置为false将不显示 String false -
onHandle 点击辅助操作按钮事件,返回src Function false -
allowRemove 是否可删除,设置为false是不显示删除按钮 Boolean false true

results matching ""

    No results matching ""