Upload image react

How to upload image in react js

import FileBase64 from "react-file-base64";
// FileBase64 <- use as component

<FileBase64 
	type="file"
    multiple={false} <- if want to upload multiple images set "true"
    onDone={} <- take callback function
/>

// onDone return an object of: filename, fileType, base64 data
// use the setState or function of useState to grap the base64 data

Upload image react

import React, { useState } from "react";

const UploadAndDisplayImage = () => {
  const [selectedImage, setSelectedImage] = useState(null);

  return (
    <div>
      <h1>Upload and Display Image usign React Hook's</h1>
      {selectedImage && (
        <div>
        <img alt="not fount" width={"250px"} src={URL.createObjectURL(selectedImage)} />
        <br />
        <button onClick={()=>setSelectedImage(null)}>Remove</button>
        </div>
      )}
      <br />
     
      <br /> 
      <input
        type="file"
        name="myImage"
        onChange={(event) => {
          console.log(event.target.files[0]);
          setSelectedImage(event.target.files[0]);
        }}
      />
    </div>
  );
};

export default UploadAndDisplayImage;

Source: stackoverflow.com

Similar codes

0 vote271 views2 answers
How to spot Error: Maximum update depth exceeded. in react
Javascript React
0 vote231 views1 answer
React tutorial componentDidMount() componentWillUnmount()
Javascript React
2 votes260 views2 answers
Display image base64 in REACT NATIVE
Javascript React
0 vote245 views1 answer
How to redirect a form to another page when we submitted a form in react js
Javascript React
4 votes249 views2 answers
'Switch' is not exported from 'react-router-dom'.
Javascript React
0 vote246 views1 answer
React native filter list
Javascript React
-1 vote259 views1 answer
How to remove react icon from tab
Javascript React
23 votes248 views5 answers
USE ICONS IN REACT
Javascript React
26 votes253 views6 answers
React redirect to url
Javascript React
0 vote227 views1 answer
React native run real device
Javascript React