title: Error when trying to load image file - Vuejs
body: <p>I am loading a Vue.js image file. That's how I get the error:</p>
  
  <blockquote>
    <p>[Vue warn]: Error in event handler for "change": "TypeError: Cannot read property 'files' of undefined"</p>
  </blockquote>
  
  <p>I also get an error as below. How do I fix it?</p>
  
  <blockquote>
    <p>Required fields are full, but empty.</p>
  </blockquote>
  
  <p>And:</p>
  
  <blockquote>
    <p>["This field is required."]</p>
  </blockquote>
  
  <p>This is my code:</p>
  
  <pre><code>&lt;template&gt;
      ...
      &lt;el-input type="file" @change="onFileChanged"/&gt;
      ...
  &lt;/template&gt;
  &lt;script&gt;
      ...
      methods: {
          onFileChanged(event) {
            const file = event.target.files[0]
            console.log(file)
          },
      }
      ...
  &lt;/script&gt;
  </code></pre>