使用axios和React将图像上传到Strapi /upload

import React, { useState } from 'react';
import axios from 'axios';

const ImageUploader = () => {
  const [selectedFile, setSelectedFile] = useState(null);

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

  const handleSubmit = (event) => {
    event.preventDefault();

    if (selectedFile) {
      const formData = new FormData();
      formData.append('files', selectedFile);

      axios.post('http://your-strapi-instance.com/upload', formData, {
        headers: {
          'Content-Type': 'multipart/form-data',
        },
      })
      .then((response) => {
        console.log('Upload success:', response);
        // 处理上传成功的逻辑
      })
      .catch((error) => {
        console.error('Upload error:', error);
        // 处理上传失败的逻辑
      });
    }
  };

  return (
    <form onSubmit={handleSubmit}>
      <input type="file" onChange={handleFileChange} />
      <button type="submit">上传图像</button>
    </form>
  );
};

export default ImageUploader;