CODEWITHSUNDEEP
javascriptvue.jsvuejs2vuetify.js
Saaransh Menon
Saaransh Menon

Reputation: 416

Why is Vue giving error while loading image

I am getting this error when I am trying to load image in vue using vuetify.

Error: TypeError: Cannot read property 'files' of undefined"

The component:

<v-file-input
          accept="image/*"
          label="File input"
          @change="uploadData($event)"
        ></v-file-input>

The method:

 methods: {
    uploadData(event) {
      let file = event.target.files[0];
      console.log(file);
    }
}

Upvotes: 0

Views: 215

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

The @change has files array as parameter by default, no need to specify the $event parameter :

<div id="app">
  <v-app id="inspire">
    <v-file-input
      accept="image/*"
      label="File input"
       @change="uploadData"       
    ></v-file-input>
  </v-app>
</div>

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
   methods: {
    uploadData(files) {
   console.log(files)
    }
}
})

LIVE DEMO

Upvotes: 1

Related Questions