单击图像以在ReactJS中上传文件

import React, { useState } from 'react';

function FileUpload() {
  const [file, setFile] = useState(null);

  const handleImageClick = () => {
    document.getElementById('fileInput').click();
  };

  const handleFileChange = (event) => {
    setFile(event.target.files[0]);
  };

  const handleSubmit = (event) => {
    event.preventDefault();
    // 在这里处理文件上传逻辑
    console.log(file);
  };

  return (
    <div>
      <img src="path/to/image.png" alt="Upload" onClick={handleImageClick} style={{ cursor: 'pointer' }} />
      <input
        type="file"
        id="fileInput"
        style={{ display: 'none' }}
        onChange={handleFileChange}
      />
      <button onClick={handleSubmit}>上传文件</button>
    </div>
  );
}

export default FileUpload;