I'm struggling with loading a file in one of my components after transitioning to Vue from using getElementById(). Here's what I've attempted so far: In the template:
<input type="file" accept=".obj" id="file" ref="OBJImport" name="objFile" @change="loadFileAsText()" single />
In data:
data(){
return {
files: []
}
}
In methods:
methods: {
loadFileAsText: function() {
if(process.client) {
this.files = this.$refs.OBJImport.files[0];
console.log(files);
}
}
However, when attempting to upload the file, I encounter the following error:
ReferenceError: files is not defined
I have also tried eliminating the [0]. Making the switch from .files[0] to .file results in the same error for files. What steps should I take to successfully pass my file from the template to my methods? Appreciate any assistance!