Breaking News: Grepper is joining You.com. Read the official announcement!

provide example of html(react) upload to endpoint in above multiple images .full code plz

dEN5 answered on June 29, 2023 Popularity 1/10 Helpfulness 1/10

answer provide example of html(react) upload to endpoint in above multiple images .full code plz

provide example of html(react) upload to endpoint in above multiple images .full code plz

Comment

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

function ImageUploader() {
  const [selectedImages, setSelectedImages] = useState([]);

  const handleImageUpload = async (event) => {
    const files = event.target.files;
    const uploadedImages = [];

    for (let i = 0; i < files.length; i++) {
      const formData = new FormData();
      formData.append('image', files[i]);

      try {
        const response = await axios.post('/api/upload', formData, {
          headers: {
            'Content-Type': 'multipart/form-data',
          },
        });

        uploadedImages.push(response.data.imageUrl);
      } catch (error) {
        console.error('Error uploading image:', error);
      }
    }

    setSelectedImages((prevSelectedImages) => [
      ...prevSelectedImages,
      ...uploadedImages,
    ]);
  };

  return (
    <div>
      <input
        type="file"
        multiple
        onChange={handleImageUpload}
      />
      {selectedImages.map((imageUrl) => (
        <img key={imageUrl} src={imageUrl} alt="Uploaded Image" />
      ))}
    </div>
  );
}

export default ImageUploader;

Popularity 1/10 Helpfulness 1/10 Language html

Source: chat.openai.com

Tags: endpoint html upload

Link to this answer
Share Copy Link

Contributed on Jun 29 2023

dEN5

0 Answers Avg Quality 2/10

provide example of html(react) upload to endpoint in above multiple images .full code plz

Contents

More Related Answers

provide example of html(react) upload to endpoint in above multiple images .full code plz

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.