JSFiddle - React, Tailwind, and code Playground
HTML
<form id="files">
<input type="file" id="CVFile" name="CVFile[]" multiple onChange="getBase64();" accept="application/pdf">
</form>
<div id="result"></div>
JavaScript
function getBase64() {
var files = Array.prototype.slice.call(document.querySelector('#files > input[type="file"]').files );
//
var list = files.reduce((acc,file)=>{
var promise = new Promise((resolve, reject) => {
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
resolve({
file: file.name,
size: file.size,
type: file.type,
lastModified: file.lastModified,
data: reader.result
});
};
//reader.onerror = function (error) {
// console.log('Error: ', error);
//};
});
acc.push(promise);
return acc;
},[]);
Promise.all(list).then(values => {
console.log(values);
let out = document.getElementById('result');
out.innerText = JSON.stringify(values);
});
}