mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-06 02:15:35 +08:00
24a86df257
* style: fix Upload picture-card button style close https://github.com/ant-design/ant-design/issues/26317 close #23339 * style: tweak Upload list animation close #22386 * fix snapshot change * docs: update Upload demos * add test case * update form demo * fix test case
1.4 KiB
1.4 KiB
order | title | ||||
---|---|---|---|---|---|
7.1 |
|
zh-CN
beforeUpload
返回 false
或 Promise.reject
时,只用于拦截上传行为,不会阻止文件进入上传列表(原因)。如果需要阻止列表展现,可以参照此例配合 onChange
进行实现。
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 using onChange
.
import React, { useState } from 'react';
import { Upload, Button, message } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
const Uploader = () => {
const [fileList, updateFileList] = useState([]);
const props = {
fileList,
beforeUpload: file => {
if (file.type !== 'image/png') {
message.error(`${file.name} is not a png file`);
}
return file.type === 'image/png';
},
onChange: info => {
console.log(info.fileList);
// file.status is empty when beforeUpload return false
updateFileList(info.fileList.filter(file => !!file.status));
},
};
return (
<Upload {...props}>
<Button icon={<UploadOutlined />}>Upload png only</Button>
</Upload>
);
};
ReactDOM.render(<Uploader />, mountNode);