JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgithub.com/bgrins/filereader.js/master/filereader.js"></script>
<a href="https://bgrins.github.io/filereader.js/">FileReader.js</a> demo
<h1 id="zone">Drop images onto this element</h1>
CSS
h1 {
padding: 50px;
border: solid 1px;
margin: 5px;
}
JavaScript
FileReaderJS.setupDrop(document.getElementById("zone"), {
readAsDefault: "DataURL",
on: {
load: function(e, file) {
var img = new Image();
img.onload = function() {
document.body.appendChild(img);
};
img.src = e.target.result;
}
}
});