AntD Upload组件未配置action上传成功却显示失败提示如何解决

antd Upload 组件默认自带上传执行逻辑，你未配置action属性时，组件内部发起的默认上传请求会直接失败，这个失败状态是组件内部独立维护的，和你后续自行调用接口上传的结果没有关联，因此才会一直弹出上传失败提示。

以下两种方案均可以保留上传列表展示，不会出现多余的错误提示：

方案1：使用customRequest覆盖默认上传逻辑（最推荐） #

这个属性可以完全接管组件的上传行为，你可以把自己的上传逻辑写在这里，同时同步上传进度、成功/失败状态给组件，既保留上传列表的原生进度展示效果，也不会触发内部默认的失败判断。
示例代码：

const fileProps = {
  name: 'file',
  multiple: false,
  // 自定义上传逻辑，完全覆盖默认上传行为
  customRequest: async (options) => {
    const { file, onSuccess, onError, onProgress } = options;
    try {
      // 此处替换为你自己的上传接口逻辑
      const formData = new FormData();
      formData.append('file', file);
      // 如需展示上传进度，可调用上传接口的进度回调同步给组件
      const res = await 你的上传接口(formData, (progressEvent) => {
        const percent = Math.round((progressEvent.loaded / progressEvent.total) * 100);
        onProgress({ percent });
      });
      // 上传成功后调用，组件会自动将文件标记为成功状态
      onSuccess(res.data, file);
      // 此处保留你自己的业务状态更新逻辑
      setUploadedImage(file);
      setData(prev => ({
        ...prev,
        image: file
      }));
      setIsFileUploaded(true);
    } catch (err) {
      // 真实上传失败时调用，组件会展示对应失败状态
      onError(err);
    }
  },
  onChange(info) {
    // 可按需保留其他状态监听逻辑
  }
};

<Upload {...fileProps}>
  <Button icon={<UploadOutlined />}>上传图片</Button>
</Upload>

方案2：阻止默认上传行为，自行维护上传状态 #

如果你完全不需要组件的上传能力，仅用它做文件选择入口，可以配置beforeUpload返回false，让组件直接跳过默认的上传流程，就不会触发内部的失败提示了。如果需要展示上传进度，你可以自行维护fileList状态传入组件，手动更新每个文件的状态、进度字段即可。
示例代码：

const [fileList, setFileList] = useState([]);

const fileProps = {
  name: 'file',
  multiple: false,
  fileList,
  // 阻止默认上传流程
  beforeUpload: () => false,
  onChange(info) {
    // 正常拿到选中的文件，自行处理后续上传逻辑
    const file = info.file.originFileObj;
    // 先添加到文件列表，标记为上传中
    setFileList([{
      uid: info.file.uid,
      name: info.file.name,
      status: 'uploading',
      percent: 0,
      originFileObj: file
    }]);
    
    // 你的文件读取、上传逻辑
    let reader = new FileReader();
    reader.onload = (e) => {
      setData({
        ...data,
        image: new File([e.target.result], info.file.name),
      });
      setIsFileUploaded(true);
    }
    reader.readAsDataURL(file);
    setUploadedImage(file);
    
    // 上传过程中自行更新进度、状态
    // 上传成功后更新fileList里对应文件的status为done
    // 上传失败更新status为error
  }
};

内容的提问来源于stack exchange，提问作者incredible123