mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-01 06:49:32 +08:00
50 lines
1.1 KiB
TypeScript
50 lines
1.1 KiB
TypeScript
|
import React from 'react';
|
||
|
import { UploadOutlined } from '@ant-design/icons';
|
||
|
import { Button, Upload } from 'antd';
|
||
|
import type { UploadFile } from 'antd/es/upload/interface';
|
||
|
|
||
|
const fileList: UploadFile[] = [
|
||
|
{
|
||
|
uid: '0',
|
||
|
name: 'xxx.png',
|
||
|
status: 'uploading',
|
||
|
percent: 33,
|
||
|
},
|
||
|
{
|
||
|
uid: '-1',
|
||
|
name: 'yyy.png',
|
||
|
status: 'done',
|
||
|
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
|
||
|
thumbUrl: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
|
||
|
},
|
||
|
{
|
||
|
uid: '-2',
|
||
|
name: 'zzz.png',
|
||
|
status: 'error',
|
||
|
},
|
||
|
];
|
||
|
|
||
|
const App: React.FC = () => (
|
||
|
<>
|
||
|
<Upload
|
||
|
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
|
||
|
listType="picture"
|
||
|
defaultFileList={[...fileList]}
|
||
|
>
|
||
|
<Button icon={<UploadOutlined />}>Upload</Button>
|
||
|
</Upload>
|
||
|
<br />
|
||
|
<br />
|
||
|
<Upload
|
||
|
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
|
||
|
listType="picture"
|
||
|
defaultFileList={[...fileList]}
|
||
|
className="upload-list-inline"
|
||
|
>
|
||
|
<Button icon={<UploadOutlined />}>Upload</Button>
|
||
|
</Upload>
|
||
|
</>
|
||
|
);
|
||
|
|
||
|
export default App;
|