An issue occurs recently with a vue app when I try to download a CSV file using Axios, and I am not sure how to troubleshoot it.
downloadFile: function(res = "") {
axios
.get('/api/file/' + res, 'blob')
.then(({ data }) => {
const blob = new Blob([data], {type: 'text/csv'});
let link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = res;
link.click();
}).catch(error => console.error(error))
}
whenever <div v-on:click="downloadFile(filename)">
is clicked, following prints on console:
vue.min.js:6 TypeError: Cannot use 'in' operator to search for 'validateStatus' in blob
at spread.js:25
at Object.b [as forEach] (spread.js:25)
at e.exports (spread.js:25)
at r.<computed> [as get] (spread.js:25)
at Function.get (spread.js:25)
at a.downloadFile (eval at compile (http-vue-loader:161), <anonymous>:73:22)
at click (eval at Ya (vue.min.js:6), <anonymous>:3:1183)
at He (vue.min.js:6)
at HTMLDivElement.n (vue.min.js:6)
at HTMLDivElement.Yr.o._wrapper (vue.min.js:6)
We got the same error on a delete.
This was fixed by removing a redundant parameter that is now treated as config.
The Axios.delete method does not have a data parameter, and the validation was improved in 0.20.0