drag

A Light and simple reactjs drag and drop library

Jun 21, 2021
A Light and simple reactjs drag and drop library

React Drag and drop files

Light React Drag & Drop files and images library styled by styled-components.

Installation

Install it from npm (using NPM).

npm i --save react-drag-drop-files

Usage

Using react hooks just as simple as:

import React, { useState } from "react"; import { FileUploader } from "react-drag-drop-files"; const fileTypes = ["JPG", "PNG", "GIF"]; function DragDrop() { const [file, setFile] = useState(null); const handleChange = file => { setFile(file); }; return ( <FileUploader file={file} handleChange={handleChange} name="file" types={fileTypes} /> ); } export default DragDrop;

Upcoming...

  • Files Validation
  • Adding Multiple Files
  • Testing
  • Typesscript Support
  • Contribution Guide
  • Notify With Errors

GitHub

https://github.com/KarimMokhtar/react-drag-drop-files

Recommended