@hi-ui/upload NPM

Upload 上传

用来上传多种格式的附件

何时使用

上传本地文档

上传图片附件或照片墙

使用示例

Upload Props

参数	说明	类型	可选值	默认值
type	上传组件类型	string	default \| drag \| pictureCard \| avatar \| photo	default
accept	接收上传的文件类型，用逗号隔开的 MIME 类型列表，参考 MDN-MIME 类型	string	-	-
content	上传按钮文案，仅在 type === 'default' 的时候有效	ReactNode	-	本地上传
tips	上传文件信息提示	string \| ReactNode	-	本地上传
maxSize	接收上传的文件体积上限（单位：KB）	number	-	-
maxCount	接收上传的文件最大数量	number	-	-
uploadAction	必选，上传的地址 \| (file) => Promise	string	-	-
data	除了上传文件外的其它 form 参数	object	-	-
name	发到后台文件参数名	string	-	file
disabled	是否禁用	boolean	true \| false	false
headers	设置上传的请求头部	object	-	{ 'Content-type': 'multipart/form-data' }
withCredentials	上传请求时是否携带 cookie	boolean	true \| false	false
showUploadList	是否展示 uploadList, 仅在 type === 'default' 和 type === 'pictureCard' 时有效	boolean	true \| false	true
multiple	是否支持多选文件	boolean	true \| false	false
defaultFileList	默认已上传文件列表	File[]	-	[]
fileList	已上传文件列表（受控）	File[]	-	-
beforeUpload	上传文件前的钩子，返回 true 继续上传，其他终止上传	(files: File[], fileList: File[]) => boolean	-	() => true
customUpload	自定义上传，此时不会再触发 onChange，所有上传逻辑转移到该函数	(files: Files[]) => void	-	-
loading	文件上传按钮是否 loading，为 true 时按钮不可点击。仅在 type='default' 时有效	boolean	true \| false	false
photoSize	设置上传按钮大小,仅在 type === 'photo' 时有效	string	'sm' \| 'md' \| 'lg'	'md'

Events

名称	说明	类型	参数	返回值
onChange	上传回调	(file: File, fileList: File[], response: object) => boolean	file: 上传的文件对象 fileList: 当前已上传文件列表集合 response: 响应对象	boolean \| `Promise<boolean>`: 返回 false 则已上传文件列表不展示该文件
onRemove	删除上传的文件	(file: File, fileList: File[], index: number) => boolean	file: 移除的文件对象, fileList: 当前已上传文件列表集合, index 索引	boolean \| `Promise<boolean>`: 返回 false 则不可删除，返回 true 时在前端删除文件
onDownload	点击已上传的文件时的回调	(file: File) => void	file: 点击的文件对象	-

Type

File

参数	说明	类型	可选值	默认值
fileId	上传文件 id	string	-	-
fileType	文件类型	string	-	-
name	文件名	string	-	-
uploadState	上传文件状态	string	'success' \| 'uploading' \| 'error'	-
url	上传文件地址	string	-	-

CHANGELOG

参数	变更类型	变更内容	解决的问题
propName	feature \| deprecated \| update	变更了什么	之前是什么样子，解决什么问题
----	----	----	----
File.abort	feature	-	功能强化
File.progressNumber	feature	-	功能强化