5.6 KiB
5.6 KiB
:: BASE_DOC ::
API
Upload Props
| name | type | default | description | required |
|---|---|---|---|---|
| style | Object | - | CSS(Cascading Style Sheets) | N |
| custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N |
| add-content | String / Slot | - | see more ts definition | N |
| allow-upload-duplicate-file | Boolean | false | 暂不支持。allow to upload duplicate name files |
N |
| config | Object | - | Typescript：UploadMpConfig type UploadMpConfig = ImageConfig | VideoConfig interface ImageConfig { count?: number; sizeType?: Array<SizeTypeValues>; sourceType?: Array<SourceTypeValues> } type SizeTypeValues = 'original' | 'compressed' type SourceTypeValues = 'album' | 'camera' interface VideoConfig { sourceType?: Array<SourceTypeValues>; compressed?: boolean; maxDuration?: number; camera?: 'back' | 'front' }。see more ts definition |
N |
| disabled | Boolean | undefined | make upload to be disabled | N |
| draggable | Boolean / Object | - | Typescript：boolean | {vibrate?: boolean; collisionVibrate?: boolean} |
N |
| files | Array | - | Typescript：Array<UploadFile> interface UploadFile { url: string; name?: string; size?: number; type?: 'image' | 'video'; percent?: number; status: 'loading' | 'reload' | 'failed' | 'done' }。see more ts definition |
N |
| default-files | Array | undefined | uncontrolled property。Typescript：Array<UploadFile> interface UploadFile { url: string; name?: string; size?: number; type?: 'image' | 'video'; percent?: number; status: 'loading' | 'reload' | 'failed' | 'done' }。see more ts definition |
N |
| grid-config | Object | - | Typescript：{column?: number; width?: number; height?: number;} |
N |
| gutter | Number | 16 | - | N |
| image-props | Object | - | Typescript：ImageProps，Image API Documents。see more ts definition |
N |
| max | Number | 0 | max count of files limit | N |
| media-type | Array | ['image', 'video'] | Typescript：Array<MediaType> type MediaType = 'image' | 'video'。see more ts definition |
N |
| request-method | Function | - | - | N |
| size-limit | Number / Object | - | files size limit。Typescript：number | SizeLimitObj interface SizeLimitObj { size: number; unit: SizeUnit ; message?: string } type SizeUnitArray = ['B', 'KB', 'MB', 'GB'] type SizeUnit = SizeUnitArray[number]。see more ts definition |
N |
| source | String | media | options: media/messageFile | N |
| transition | Object | { backTransition: true, duration: 300, timingFunction: 'ease' } | Typescript：Transition interface Transition { backTransition?: boolean, duration?: number, timingFunction?: string }。see more ts definition |
N |
Upload Events
| name | params | description |
|---|---|---|
| add | (files: MediaContext) |
see more ts definition。type MediaContext = VideoContext[] | ImageContext[]interface VideoContext { name?: string; type?: string; url?: string; duration?: number; size?: number; width?: number; height?: number; thumb: string; progress: number }interface ImageContext { name: string; type: string; url: string; size: number; width: number; height: number; progress: number } |
| click | (file: VideoContext | ImageContext) |
- |
| complete | - | - |
| drop | (files: MediaContext) |
see more ts definition。type MediaContext = VideoContext[] | ImageContext[]; interface VideoContext { name?: string; type?: string; url?: string; duration?: number; size?: number; width?: number; height?: number; thumb: string; progress: number }; interface ImageContext { name: string; type: string; url: string; size: number; width: number; height: number; progress: number} |
| fail | - | - |
| remove | (index: number; file: UploadFile) |
- |
| select-change | (files: MediaContext[]; currentSelectedFiles: MediaContext[]) |
- |
| success | (files: MediaContext) |
see more ts definition。type MediaContext = VideoContext[] | ImageContext[]interface VideoContext { name?: string; type?: string; url?: string; duration?: number; size?: number; width?: number; height?: number; thumb: string; progress: number }interface ImageContext { name: string; type: string; url: string; size: number; width: number; height: number; progress: number } |
CSS Variables
The component provides the following CSS variables, which can be used to customize styles.
| Name | Default Value | Description |
|---|---|---|
| --td-upload-add-bg-color | @bg-color-secondarycontainer | - |
| --td-upload-add-color | @font-gray-3 | - |
| --td-upload-add-disabled-bg-color | @bg-color-component-disabled | - |
| --td-upload-add-icon-disabled-color | @text-color-disabled | - |
| --td-upload-add-icon-font-size | 56rpx | - |
| --td-upload-disabled-mask | rgba(255, 255, 255, 0.55) | - |
| --td-upload-radius | @radius-default | - |
| --td-upload-drag-z-index | 999 | - |