# Upload 上传

文件上传控件。

## 使用示例

<!-- <Half> -->

### 点击上传

点击上传的基本用法。

[Example: UploadExample](./_example/UploadExample.jsx)

### 基本拖拽上传

拖拽上传的基本用法。

[Example: SimpleDndUploadExample](./_example/SimpleDndUploadExample.jsx)

### 多选上传

设置 `multiple` 属性启用多选上传。

[Example: UploadMultipleExample](./_example/UploadMultipleExample.jsx)

### 文件夹上传

设置 `directory` 属性启用文件夹上传。

[Example: UploadDirectoryExample](./_example/UploadDirectoryExample.jsx)

<!-- </Half> -->

## 预置场景

<!-- <Half> -->

### 文件上传

预置的单文件上传样式示例。

[Example: FileUploadExample](./_example/FileUploadExample.jsx)

### 拖拽上传

预置的拖拽上传样式示例，当 `filename` 属性不为空时将渲染文件信息。

[Example: DraggerUploadExample](./_example/DraggerUploadExample.jsx)

### 图片上传

预置的图片上传样式示例。

[Example: ImageUploadExample](./_example/ImageUploadExample.jsx)

### 拖拽上传（包含预览图）

拖拽上传可通过 `image` 属性指定预览图。

[Example: DraggerImageUploadExample](./_example/DraggerImageUploadExample.jsx)

<!-- </Half> -->

## 组件属性

[Interface: UploadProps](./Upload.tsx)

[Interface: FileProps](./preset/File.tsx)

[Interface: DraggerProps](./preset/Dragger.tsx)

[Interface: ImageProps](./preset/Image.tsx)

## 已知问题

Firefox 拖拽导致新开页面，类似 issue：

https://github.com/SortableJS/Sortable/issues/985