import React from 'react'; import Taro from '@tarojs/taro'; import { UploadOptions } from './upload'; import { BasicComponent } from '../../utils/typings'; export type FileType = { [key: string]: T; }; export type FileItemStatus = 'ready' | 'uploading' | 'success' | 'error' | 'removed'; /** 图片的尺寸 */ 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)[] mediaType: (keyof mediaType)[]; camera: string; /** * 可以设定最大上传文件的大小(字节) * @default Number.MAX_VALUE */ maxFileSize: number /** * 默认已经上传的文件列表 * @default [] */ defaultValue?: FileType[] /** * 已经上传的文件列表 * @default [] */ value?: FileType[] /** * 上传列表的内建样式,支持两种基本样式 picture、list * @default 'picture' */ previewType: 'picture' | 'list' /** * 图片填充模式 * @default 'cover' */ imageFit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' /** * 上传区域[图标名称](#/zh-CN/icon) * @default - */ uploadIcon?: React.ReactNode /** * 上传区域图片下方文字 * @default "" */ uploadLabel?: React.ReactNode /** * input 标签 name 的名称,发到后台的文件参数名 * @default 'file' */ name: string 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: object /** * 上传请求的 http method * @default 'post' */ method: string /** * 接口响应的成功状态(status)值 * @default 200 */ xhrState: number | string /** * 设置上传的请求头部 * @default {} */ headers: object /** * 是否上传成功后展示预览图 * @default true */ preview: boolean /** * 是否展示删除按钮 * @default true */ deletable: boolean className: string; /** * 当上传非图片('image')格式的默认图片地址 * @default '' */ previewUrl?: string maxDuration: number; style: React.CSSProperties; /** * 文件上传开始 * @default */ onStart?: (option: UploadOptions) => void /** * 文件删除之前的状态 * @default */ onDelete?: (file: FileItem, fileList: FileType[]) => void /** * 上传成功 * @default */ onSuccess?: (param: { responseText: XMLHttpRequest['responseText']; option: UploadOptions; fileList: FileType[]; }) => void /** * 文件上传的进度 * @default */ onProgress?: (param: { e: ProgressEvent; option: UploadOptions; percentage: React.ReactNode; }) => void /** * 上传失败 * @default */ onFailure?: (param: { responseText: XMLHttpRequest['responseText']; option: UploadOptions; fileList: FileType[]; }) => void onUpdate?: (fileList: FileType[]) => void; /** * 文件大小超过限制时触发 * @default */ onOversize?: (files: Taro.chooseImage.ImageFile[] | Taro.chooseMedia.ChooseMedia[] | any) => void /** * 上传文件改变时的状态 * @default */ onChange?: (param: { fileList: FileType[]; }) => void /** * 执行 XHR 上传时,自定义方式 * @default - */ beforeXhrUpload?: (xhr: XMLHttpRequest, options: any) => void /** * 除文件时的回调,返回值为 false 时不移除。支持返回一个 Promise 对象,Promise 对象 resolve(false) 或 reject 时不移除 * @default - */ beforeDelete?: (file: FileItem, files: FileType[]) => boolean /** * 文件上传成功后点击触发 * @default */ onFileItemClick?: (file: FileItem) => void } export declare class FileItem { status: FileItemStatus; message: string; uid: string; name?: string; url?: string; type?: string; path?: string; percentage: string | number; formData: any; } export declare const Uploader: React.ForwardRefExoticComponent & { children?: React.ReactNode; } & React.RefAttributes>; export {};