water_xcx/miniprogram_npm/tdesign-miniprogram/upload

title	description	spline	isComponent
Upload 上传	用于相册读取或拉起拍照的图片上传功能。	form	true

引入

全局引入，在 miniprogram 根目录下的app.json中配置，局部引入，在需要引入的页面或组件的index.json中配置。

"usingComponents": {
 "t-upload": "tdesign-miniprogram/upload/upload",
}

代码演示

单选上传图片

{{ single }}

多选上传图片

{{ multiple }}

API

Upload Props

名称	类型	默认值	说明	必传
add-content	String / Slot	-	添加按钮内容。值为空，使用默认图标渲染；值为 slot 则表示使用插槽渲染；其他值无效。	N
allow-upload-duplicate-file	Boolean	false	【开发中】是否允许重复上传相同文件名的文件	N
config	Object	-	图片上传配置，视频上传配置，文件上传配置等，包含图片尺寸、图片来源、视频来源、视频拍摄最长时间等。更多细节查看小程序官网。图片上传。视频上传。TS 类型：UploadMpConfig `type UploadMpConfig = ImageConfig	VideoConfig interface ImageConfig { count?: number; sizeType?: Array; sourceType?: Array } type SizeTypeValues = 'original'
file-list-display	Slot	-	【开发中】用于完全自定义文件列表内容	N
files	Array	-	已上传文件列表。TS 类型：Array<UploadFile> `interface UploadFile { url: string; name?: string; size?: number; type?: 'image'	'video'; percent?: number }`。详细类型定义
default-files	Array	undefined	已上传文件列表。非受控属性。TS 类型：Array<UploadFile> `interface UploadFile { url: string; name?: string; size?: number; type?: 'image'	'video'; percent?: number }`。详细类型定义
grid-config	Object	-	upload组件每行上传图片列数以及图片的宽度和高度。TS 类型：{ column?: number; width?: number; height?: number; }	N
gutter	Number	16	预览窗格的 gutter 大小，单位 rpx	N
image-props	Object	-	透传 Image 组件全部属性。TS 类型：ImageProps，Image API Documents。详细类型定义	N
max	Number	0	用于控制文件上传数量，值为 0 则不限制	N
media-type	Array	['image', 'video']	支持上传的文件类型，图片或视频。TS 类型：Array<MediaType> `type MediaType = 'image'	'video'`。详细类型定义
request-method	Function	-	自定义上传方法	N
size-limit	Number / Object	-	图片文件大小限制，单位 KB。可选单位有：`'B'	'KB'
source	String	media	来源。可选项：media/messageFile	N

Upload Events

名称	参数	描述
add	(files: MediaContext)	选择后触发，仅包含本次选择的照片；url 表示选定视频的临时文件路径 (本地路径)。duration 表示选定视频的时间长度。size选定视频的数据量大小。更多描述参考 wx.chooseMedia 小程序官网描述。详细类型定义。 `type MediaContext = VideoContext[]
complete	-	上传成功或失败后触发
fail	-	上传失败后触发
remove	(index: number; file: UploadFile)	移除文件时触发
select-change	(files: MediaContext[]; currentSelectedFiles: MediaContext[])	选择文件或图片之后，上传之前，触发该事件。 files 表示之前已经上传完成的文件列表。 currentSelectedFiles 表示本次上传选中的文件列表
success	(files: MediaContext)	上传成功后触发，包含所有上传的文件；url 表示选定视频的临时文件路径 (本地路径)。duration 表示选定视频的时间长度。size选定视频的数据量大小。更多描述参考 wx.chooseMedia 小程序官网描述。详细类型定义。 `type MediaContext = VideoContext[]
click	`(file: VideoContext	ImageContext)`