mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-19 11:58:41 +08:00
79f8fece4b
* chore: Update Upload version * useMergedStatus * fix file list parser * fix list replacement * bump rc-upload * add Upload.LIST_IGNORE * support LIST_IGNORE * fix uploadList batch test * test: fix batch case test case changed * test: Finish test case * fix: Not change uid if exist * use proxy * fix proxy * fix ts * part test case check * more test back * back of test all * update test case * more unmount * adjust test cae * add unmount
42 lines
1.2 KiB
Markdown
42 lines
1.2 KiB
Markdown
---
|
|
order: 7.1
|
|
title:
|
|
zh-CN: 只上传 png 图片
|
|
en-US: Upload png file only
|
|
---
|
|
|
|
## zh-CN
|
|
|
|
`beforeUpload` 返回 `false` 或 `Promise.reject` 时，只用于拦截上传行为，不会阻止文件进入上传列表（[原因](https://github.com/ant-design/ant-design/issues/15561#issuecomment-475108235)）。如果需要阻止列表展现，可以通过返回 `Upload.LIST_IGNORE` 实现。
|
|
|
|
## en-US
|
|
|
|
`beforeUpload` only prevent upload behavior when return false or reject promise, the prevented file would still show in file list. Here is the example you can keep prevented files out of list by return `UPLOAD.LIST_IGNORE`.
|
|
|
|
```jsx
|
|
import React, { useState } from 'react';
|
|
import { Upload, Button, message } from 'antd';
|
|
import { UploadOutlined } from '@ant-design/icons';
|
|
|
|
const Uploader = () => {
|
|
const props = {
|
|
beforeUpload: file => {
|
|
if (file.type !== 'image/png') {
|
|
message.error(`${file.name} is not a png file`);
|
|
}
|
|
return file.type === 'image/png' ? true : Upload.LIST_IGNORE;
|
|
},
|
|
onChange: info => {
|
|
console.log(info.fileList);
|
|
},
|
|
};
|
|
return (
|
|
<Upload {...props}>
|
|
<Button icon={<UploadOutlined />}>Upload png only</Button>
|
|
</Upload>
|
|
);
|
|
};
|
|
|
|
ReactDOM.render(<Uploader />, mountNode);
|
|
```
|