File Upload using html & Css in React

File Upload in React

Using Normal Html / Css 

In the world of web development, file upload functionality is a crucial feature. 

It allows users to upload files such as images, documents, and more to a server.

import { useState } from "react";

export default function FileUpload(){

    const [file , setFile]= useState();

    const handlerFile=(event)=>{

        setFile(event.target.files[0]);

        console.log(event.target.files[0]);

    }

    // or

    // function handlerFile(event){

    //     setFile(event.target.files[0]);

    //     console.log(file);

    // }

    const handleUpload=()=>{

        const fromData = new FormData();

        FormData.append('file', file);

    }

    return (

        <div>

            <h2>File Upload in React Js</h2>

            <form onSubmit={handleUpload}>

                <input type="file" name="file" onChange={handlerFile} />

                <br />

                <button>Upload</button>

            </form>

        </div>

    );

}