如何在React中设置图片上传的大小和文件类型

npm install react-dropzone

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

function ImageUpload() {
  const [selectedImage, setSelectedImage] = useState(null);

  const handleDrop = (acceptedFiles) => {
    // 处理文件上传逻辑
    const file = acceptedFiles[0];
    setSelectedImage(URL.createObjectURL(file));
  };

  return (
    <div>
      <Dropzone onDrop={handleDrop} accept="image/*" maxSize={5242880}>
        {({ getRootProps, getInputProps }) => (
          <div {...getRootProps()}>
            <input {...getInputProps()} />
            {selectedImage ? (
              <img src={selectedImage} alt="Selected" />
            ) : (
              <p>拖拽图片文件到这里，或点击选择图片上传</p>
            )}
          </div>
        )}
      </Dropzone>
    </div>
  );
}

export default ImageUpload;