I'm new to Vue, I tried some similar potential solutions I found but none worked:
I need to update this.data_object from within a method, which contains nested functions. I can't figure out the inheritance.
I've tried this which doesn't exist, a copy of vm. from my main.js file, vm.$root and a few other combos.
Here is example code:
//this method is called on a file upload dropzone with :on-change="handlePreview"
handlePreview(file,files) {//file
var reader = new FileReader();
reader.onload = function (reader) {
papaparse.parse(reader.target.result, {
step: function(row) {
console.log("Row:", row.data);
//this is where i need to update data for this template. i defined this as data.preview_table{items:[]}
vm.this.preview_table.items.push(row.data)
}
});
}
reader.readAsText(this.files[0].raw, "UTF-8");
}
Thanks for the help here is updated code where inheritance works:
handlePreview(file,files) {//file
var reader = new FileReader();
reader.onload = (reader) => {
papaparse.parse(reader.target.result, {
worker: true,
//header:true,
delimiter: ",",
download: false,
preview: 6,
step: (row) => {
console.log("Row:", row.data);
console.log(this.is_preview_loaded)
this.preview_table.items.push(row.data)
},
complete: (event) => {
console.log(event)
},
error: (error,file) => {
console.log(error)
return swal.fire({
title: `Error parsing this file`,
text: 'Please double check this is a correct CSV file',
buttonsStyling: false,
icon: 'warning'
})
}
});
}
reader.readAsText(this.files[0].raw, "UTF-8");
},