mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-15 08:59:15 +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';
|
|
|
|
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://660d2bd96ddfa2943b33731c.mockapi.io/api/upload"
|
|
listType="picture"
|
|
defaultFileList={[...fileList]}
|
|
>
|
|
<Button icon={<UploadOutlined />}>Upload</Button>
|
|
</Upload>
|
|
<br />
|
|
<br />
|
|
<Upload
|
|
action="https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload"
|
|
listType="picture"
|
|
defaultFileList={[...fileList]}
|
|
className="upload-list-inline"
|
|
>
|
|
<Button icon={<UploadOutlined />}>Upload</Button>
|
|
</Upload>
|
|
</>
|
|
);
|
|
|
|
export default App;
|