title: VueJS FileReader
body: <p>I'm trying to use ExcelJS in Vue and I need FileReader to read and parse the files but I'm getting errors. How do I use FileReader with VueJS?</p>
  <p><strong>Input Form</strong></p>
  <pre class="lang-html prettyprint-override"><code>    &lt;input type=&quot;file&quot; 
          id=&quot;importProductionSchedule&quot; 
          name=&quot;importProductionSchedule&quot; 
          @change=&quot;checkFile($event)&quot; 
          ref=&quot;importProductionSchedule&quot;
      &gt;
  </code></pre>
  <p><strong>checkFile method</strong></p>
  <pre class="lang-js prettyprint-override"><code>    checkFile() {
          let reader = new FileReader()
          let self = this
  
          reader.onload = (e) =&gt; {
              let bstr = e.target.result
              let wb = XLSX.read(bstr, {type:'binary'})
              let wsname = wb.SheetNames[0]
              let ws = wb.Sheets[wsname]
              let data = XLSX.utils.sheet_to_json(ws, {header:1})
              self.form.filedata = data
              self.cols = make_cols(ws['!ref'])
          }
          reader.onerror = (stuff) =&gt; {
              console.log(&quot;error&quot;, stuff)
              console.log (stuff.getMessage())
          }
          // reader.readAsArrayBuffer(event)
          reader.readAsBinaryString(event.target.files[0])
      },
  </code></pre>
  <p>First of all, logging event.target.files[0] in the console would return the file, but I'm testing both event and event.target.files[0] to make sure.</p>
  <p>These are my errors:</p>
  <pre class="lang-js prettyprint-override"><code>    event = Uncaught Error: cannot read as File: {&quot;isTrusted&quot;:true}
      event.target.files[0] = Uncaught Error: cannot read as File: {}
  </code></pre>