ant-design/components/upload/demo/picture-style.tsx
二货爱吃白萝卜 e7aa014c31
chore: Add type util (#46923)
* docs: init

* chore: all types

* docs: faq

* chore: fix lint
2024-01-11 15:55:58 +08:00

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://run.mocky.io/v3/435e224c-44fb-4773-9faf-380c5e6a2188"
listType="picture"
defaultFileList={[...fileList]}
>
<Button icon={<UploadOutlined />}>Upload</Button>
</Upload>
<br />
<br />
<Upload
action="https://run.mocky.io/v3/435e224c-44fb-4773-9faf-380c5e6a2188"
listType="picture"
defaultFileList={[...fileList]}
className="upload-list-inline"
>
<Button icon={<UploadOutlined />}>Upload</Button>
</Upload>
</>
);
export default App;