Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vuetify v-file-input "onchange" working but not getting the event

Please take a look at my code below. My input works well, but not the v-file-input:

<v-file-input
  accept=".json"
  ref="loadedFile"
  label="Upload file"
  @change="checkJSON"
  ></v-file-input>

<input
    type="file"
    accept=".json"
    @change="checkJSON"
    >



methods: {
  checkJSON: function(e) {
    console.log("JSON checking")
    console.log(JSON.stringify(e))
    console.log(e.target.files)
    return
  }
}

The console shows the file for the input, but here is the message I get for the v-file-input:

[Vue warn]: Error in v-on handler: "TypeError: e.target is undefined"

Is that normal? I'd like to use the vuetify component, it's prettier. Thanks in advance.

like image 660
djcaesar9114 Avatar asked Jan 26 '23 00:01

djcaesar9114


1 Answers

Acording to Vuetify doc to v-file-input, @change event has 1 param which is an array of Files.

checkJSON: function(files) {
    console.log(files)
}

This event is diferent to @change from your input.

like image 77
Hans Felix Ramos Avatar answered May 05 '23 16:05

Hans Felix Ramos