antd 5.6版本的Upload上传组件手动上传怎么设置进度条

要设置手动上传时的进度条，你需要在 Upload 组件中使用 `customRequest` 属性来自定义上传操作。在自定义上传函数中，你可以使用 `onProgress` 属性来监听上传进度，并通过回调函数更新进度条的状态。

以下是一个示例代码：

import { Upload, message, Progress } from 'antd';
import axios from 'axios';

const MyUpload = () => {
  const [progress, setProgress] = useState(0);

  const handleUpload = ({ file }) => {
    const formData = new FormData();
    formData.append('file', file);

    axios.post('/api/upload', formData, {
      onUploadProgress: (progressEvent) => {
        const percentCompleted = Math.round(
          (progressEvent.loaded * 100) / progressEvent.total
        );
        setProgress(percentCompleted);
      },
    })
    .then((res) => {
      message.success(`${file.name} 上传成功`);
    })
    .catch((err) => {
      message.error(`${file.name} 上传失败`);
    });
  };

  return (
    <>
      <Upload customRequest={handleUpload}>
        <Button>上传文件</Button>
      </Upload>
      <Progress percent={progress} />
    </>
  );
};

在上面的代码中，我们首先定义了一个 `progress` 状态来保存上传进度，然后在 `handleUpload` 函数中使用 `axios` 发送上传请求，并在 `onUploadProgress` 回调函数中更新 `progress` 状态。最后，我们将进度条组件的 `percent` 属性设置为 `progress` 状态，即可实现上传时的进度条显示。