JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" id="input">
<img id="preview" src="about:blank" alt="" width="70" height="40">

JavaScript

(function() {

    var URL = window.URL || window.webkitURL;

    var input = document.querySelector('#input');
    var preview = document.querySelector('#preview');
    
    // When the file input changes, create a object URL around the file.
    input.addEventListener('change', function () {
        preview.src = URL.createObjectURL(this.files[0]);
    });
    
    // When the image loads, release object URL
    preview.addEventListener('load', function () {
        URL.revokeObjectURL(this.src);
        
        
    });
})();