import { default as React } from 'react'; import { default as Taro } from '@tarojs/taro'; import { UploadOptions } from './upload'; import { BasicComponent } from '../../utils/typings'; import { FileItem } from './file-item'; interface sizeType { /** 原图 */ original: string; /** compressed */ compressed: string; } interface sourceType { /** 从相册选图 */ album: string; /** 使用相机 */ camera: string; } interface mediaType { /** 只能拍摄图片或从相册选择图片 */ image: string; /** 只能拍摄视频或从相册选择视频 */ video: string; } export interface UploaderProps extends BasicComponent { /** * 上传服务器的接口地址 * @default - */ url: string /** * 文件上传数量限制 * @default 1 */ maxCount: string | number /** * [是否压缩所选文件]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") * @default ['original','compressed'] */ sizeType: (keyof sizeType)[] /** * [选择文件的来源]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") * @default ['album','camera'] */ sourceType: (keyof sourceType)[] /** * [选择文件类型]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") * @default ['image', 'video', 'mix'] */ mediaType: (keyof mediaType)[] /** * 仅在 source-type 为 camera 时生效,使用前置或后置摄像头 * @default back */ camera: string /** * 可以设定最大上传文件的大小(字节) * @default Number.MAX_VALUE */ maxFileSize: number /** * 默认已经上传的文件列表 * @default [] */ defaultValue?: FileItem[] /** * 已经上传的文件列表 * @default [] */ value?: FileItem[] /** * 上传列表的内建样式,支持两种基本样式 picture、list * @default picture */ previewType: 'picture' | 'list' /** * 图片填充模式 * @default cover */ fit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' /** * 上传区域图标名称 * @default - */ uploadIcon?: React.ReactNode /** * 删除区域的图标名称 * @default - */ deleteIcon?: React.ReactNode /** * 上传区域图片下方文字 * @default "" */ uploadLabel?: React.ReactNode /** * input 标签 name 的名称,发到后台的文件参数名 * @default file */ name: string /** * H5 端 input 的 accept 属性,用于限制选择的文件类型(仅 H5 端生效) * @default * */ accept: string /** * 是否禁用文件上传 * @default false */ disabled: boolean /** * 是否在选取文件后立即进行上传,false 时需要手动执行 ref submit 方法进行上传 * @default true */ autoUpload: boolean /** * 是否支持文件多选 * @default false */ multiple: boolean /** * 超时时间,单位为毫秒 * @default 1000 * 30 */ timeout: number /** * 附加上传的信息 formData * @default {} */ data: any /** * 上传请求的 http method * @default post */ method: string /** * 接口响应的成功状态(status)值 * @default 200 */ xhrState: number | string /** * 设置上传的请求头部 * @default {} */ headers: any /** * 是否上传成功后展示预览图 * @default true */ preview: boolean /** * 是否展示删除按钮 * @default true */ deletable: boolean className: string; /** * 当上传非图片('image')格式的默认图片地址 * @default - */ previewUrl?: string /** * 拍摄视频最长拍摄时间,单位秒。时间范围为 3s 至 60s 之间。不限制相册。 * @default 10 */ maxDuration: number style: React.CSSProperties; /** * 文件上传开始 * @default - */ onStart?: (option: UploadOptions) => void /** * 文件删除之前的状态 * @default - */ onDelete?: (file: FileItem, files: FileItem[]) => void /** * 上传成功 * @default - */ onSuccess?: (param: { responseText: XMLHttpRequest['responseText']; option: UploadOptions; files: FileItem[]; }) => void /** * 文件上传的进度 * @default - */ onProgress?: (param: { e: ProgressEvent; option: UploadOptions; percentage: number | string; }) => void /** * 上传失败 * @default - */ onFailure?: (param: { responseText: XMLHttpRequest['responseText']; option: UploadOptions; files: FileItem[]; }) => void onUpdate?: (files: FileItem[]) => void; /** * 文件大小超过限制时触发 * @default - */ onOversize?: (files: Taro.chooseImage.ImageFile[] | Taro.chooseMedia.ChooseMedia[] | any) => void /** * 上传文件改变时的状态 * @default - */ onChange?: (files: FileItem[]) => void /** * 上传前的函数需要返回一个Promise对象 * @default - */ beforeUpload?: (files: Taro.chooseImage.ImageFile[] | Taro.chooseMedia.ChooseMedia[] | any) => Promise /** * 执行 XHR 上传时,自定义方式 * @default - */ beforeXhrUpload?: (xhr: XMLHttpRequest, options: any) => void /** * 除文件时的回调,返回值为 false 时不移除。支持返回一个 Promise 对象,Promise 对象 resolve(false) 或 reject 时不移除 * @default - */ beforeDelete?: (file: FileItem, files: FileItem[]) => boolean /** * 文件上传成功后点击触发 * @default - */ onFileItemClick?: (file: FileItem, index: number) => void /** * 是否在 H5 端使用原生 input 选择文件(配合 accept 自定义文件类型,仅 H5 端生效) * @default false */ needChooseFile?: boolean } export declare const Uploader: React.ForwardRefExoticComponent & { children?: React.ReactNode | undefined; } & React.RefAttributes>; export {};