[Vuejs]-Vuejs this.$refs.file1.files[0] rasies an error cannot read property '0' of undefined at VueComponent.filesChange

5👍

the problem is that your input[type=file] is into a v-for. So there is probably more than just one $refs['file1'].

You should work with the targeted input element for your event:

<div id="app">
  <input type="file" name="myFile" @change="fileChanged">
</div>

new Vue({
    el: '#app',
  methods: {
    fileChanged (e) {
        console.log(e.target.files)
    }
  }
})

https://jsfiddle.net/71tw6zu0/

3👍

I changed the code to this one and works perfectly.

enter image description here

filesChange(fieldName, fileList) {
    console.log (fileList)
    if (!fileList.length) return;
    this.files[0]=fileList[0];
  }

Leave a comment