If you add debugger
statement in your function, you can clearly see that this.chosenFile
is an array
FileReader is for a "file"
Adjust your code:
importTxt() {
console.log('import')
if (!this.chosenFile) {
this.data = "No File Chosen";
} else {
console.log("File selected");
console.log(this.chosenFile);
if (!this.chosenFile || this.chosenFile.length !== 1) {
console.warn('expected chosenFile to contain 1 item')
return
}
const reader = new FileReader();
// Use the javascript reader object to load the contents
// of the file in the v-model prop
reader.readAsText(this.chosenFile[0]);
reader.onload = () => {
this.data = reader.result;
}
}
}
Demo: