如何阻止 React Ant Design Upload 组件自动发布文件

【问题标题】：How to stop React Ant Design Upload component from posting files automatically如何阻止 React Ant Design Upload 组件自动发布文件
【发布时间】：2022-01-22 17:45:49
【问题描述】：

我有这个从 antd ant design documentation 得到的简单文件上传按钮：

<Upload>
  <Button
    icon={<UploadOutlined />}
    className="upload-btn"
  >
     Upload a file
  </Button>
</Upload>

每次我上传文件时，我都会在控制台日志中收到此错误：

我不希望它在我上传文件时发出发布请求，我有一个提交按钮。

【问题讨论】：

标签： javascript reactjs antd ant-design-pro

【解决方案1】：

您可以通过从 beforeUpload 属性返回 false 来做到这一点，如下所示：

<Upload beforeUpload={()=> {
    /* update state here */
    return false; }}>
    <Button icon={<UploadOutlined />}>Select File</Button>
</Upload>

显然，以这种方式，您必须定义一个状态，并将文件存储在该状态中以手动将其发送到服务器。 Here 是实现此逻辑的示例。

【讨论】：

非常感谢，它运行良好。是的，我定义了状态和提交函数等等，这只是一个提取的代码。
不客气。