Skip to content

图片上传

imageimage

介绍

用于将本地的图片上传至服务器。

API

Props

参数说明类型默认值
标题左侧标题内容string"图片上传"
显示标题左侧标题是否显示booleantrue
默认值文件默认值string''
API绑定可选择组件绑定的APIstring-
多选选择上传文件时是否可多选booleanfalse
额外数据上传请求附加的数据string-
头部信息上传请求header中的数据string-
最大上传文件个数最大上传文件个数number-
单文件最大上传大小(MB)单个文件大小的上限number20
上传文件类型上传文件的类型限制,多个以英文符号,间隔string"image/*"
展示上传区域上传区域否显示booleantrue
上传区域文字提示上传区域中需要显示的文字string''
上传区域图标上传区域中需要显示的图标string'plus'
点击预览图全屏预览点击预览图是否为全屏预览booleantrue
覆盖上传上传后覆盖上次已上传的文件(开启后将关闭图片预览)booleanfalse
图片选取模式选取已有图片或是直接拍摄图片enum默认 | 直接调起摄像头
唯一标识表单字段名string"UPLOAD_IMG_随机八位字符"
气泡提醒表单项气泡提醒,点击标题右侧图标可查看string''
必填未输入内容时校验不通过booleanfalse
自定义函数自定义校验函数,可配置校验规则与校验提示内容booleanfalse

events

事件名说明回调参数
onSuccess上传成功时触发ctx, fileItem:[{url: string}]
onExceeLimit上传的文件超出限制后触发ctx, fileList:{content: string, file: File, message: string, objectUrl: string, status: string}, fileItem: {index: number, name: string}
onPreview点击图片预览时触发ctx, fileItem:{status: string, url: string }
onBeforeUpload上传前触发ctx, file:File
onBeforeRemove移除文件前触发 注意:最后要有返回值,返回true则可以删除成功,返回false则不会删除ctx, fileItem:{status: string, url: string }, detail:{index: number, name: string}
onClickLeftIcon点击左侧图标时ctx, params:{value: string}
onClickRightIcon点击右侧图标时ctx, params:{value: string}