title: How do I upload image in vuejs?
body: <p>Please, below is my code in the script section of my vue component.</p>
  
  <p>I'm getting all the input fields right but the image and video uploads are showing empty values.</p>
  
  <p>I have tried to solve this issue but to no avail.</p>
  
  <pre><code>        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 &amp;&amp; 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 &amp;&amp; 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);
              }
  
          },
  
      }
  
  }
  </code></pre>
  
  <p>What exactly I want to achieve is upload image and video file, preview them before saving as blob.</p>
  
  <p><a href="https://i.stack.imgur.com/urLLw.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/urLLw.jpg" alt="the response"></a></p>
  
  <p>The above image shows my response @samayo</p>
  
  <p>The image and video blob are showing empty values.</p>