Currently, I am facing a challenge with storing JSON data in a variable within my Vue project.
Below is the code snippet used to upload and store the file:
<input type="file" id="file" ref="fileSelect" class="custom-file-input" @change="showfiles" /><script lang="ts">
.
.
methods: {
showfiles() {
let files = this.$refs.fileSelect.files //Error Object is of type 'unknown'. ts(2571)
var reader = new FileReader();
reader.onload = ({ target: { result }}) => { this.p = JSON.parse(result); };
reader.readAsText(files[0]);
console.log(this.p) //I am storing JSON data in p
}}
I have explored various online solutions without success. One attempt included adding
"useUnknownInCatchVariables": falsetry and catch.
showfiles() {
try{
let files = this.$refs.fileSelect.files
var reader = new FileReader();
reader.onload = ({ target: { result }}) => { this.p = JSON.parse(result); };
reader.readAsText(files[0]);
console.log(this.p)
}
catch(err) {
if (err instanceof Error) {
console.log(err.message);
} else {
console.log('Unexpected error', err);
}
}
}
Unfortunately, none of these approaches yielded the desired outcome. Any suggestions or guidance on resolving this issue would be greatly appreciated.