如何在react admin中显示上传进度？

npm install react-dropzone axios

import React, { useState } from 'react';
import Dropzone from 'react-dropzone';
import axios from 'axios';

const FileUpload = () => {
  const [progress, setProgress] = useState(0);
  // 其他代码
}

const handleFileUpload = async (files) => {
  const formData = new FormData();
  formData.append('file', files[0]);

  try {
    const response = await axios.post('/upload', formData, {
      onUploadProgress: (progressEvent) => {
        const progress = Math.round(
          (progressEvent.loaded / progressEvent.total) * 100
        );
        setProgress(progress);
      },
    });

    console.log(response.data); // 处理上传成功后的响应
  } catch (error) {
    console.error(error); // 处理上传失败的错误
  }
};

const FileUpload = () => {
  // 状态和函数定义

  return (
    <div>
      <Dropzone onDrop={handleFileUpload}>
        {({ getRootProps, getInputProps }) => (
          <div {...getRootProps()}>
            <input {...getInputProps()} />
            <p>将文件拖放到此处，或点击选择文件</p>
          </div>
        )}
      </Dropzone>
      <progress value={progress} max="100" />
    </div>
  );
};