Please, below is my code in the script section of my vue component.
I'm getting all the input fields right but the image and video uploads are showing empty values.
I have tried to solve this issue but to no avail.
playVideo(url) {
let video = $('#video-preview').get(0);
video.preload = 'metadata';
// Load video in Safari / IE11
if (url) {
video.muted = false;
video.playsInline = true;
video.play();
}
},
// Read a file input as a data URL.
readDataUrl(input, callback) {
if (input.files && input.files[0]) {
let fileReader = new FileReader();
fileReader.onload = function () {
callback(fileReader.result);
};
fileReader.readAsDataURL(input.files[0]);
}
else {
callback(null);
}
},
// Read a file input as an object url.
readObjectUrl(input, callback) {
if (input.files && input.files[0]) {
let fileReader = new FileReader();
fileReader.onload = function () {
let blob = new Blob([fileReader.result], {type: input.files[0].type});
let url = URL.createObjectURL(blob);
callback(url, blob);
};
fileReader.readAsArrayBuffer(input.files[0]);
}
else {
callback(null);
}
},
}
}
What exactly I want to achieve is upload image and video file, preview them before saving as blob.
The above image shows my response @samayo
The image and video blob are showing empty values.