'vue: Downloading excel files using node-xlsx
I am very new to programming and working on a web project. I used node-xlsx make a button that export excel data. But I got an error "Cannot read properties of undefined (reading 'utils')".
I think not many people are having the same problem. It will be grateful if someone advice me solutions.
My template only contains a button.
<template>
<v-card class="custm">
<v-btn @click="excelDown">excel</v-btn>
</v-card>
</template>
My Data: See bottom
<script lang="ts">
import Vue from "vue";
import XLSX from 'xlsx';
public incomeLogData = new Array<IncomeLog>();
get IncomeLogList() {
return this.incomeLogData;
}
mounted() {
this.setData();
}
setData() {
// header
this.headers = [
{
text: this.$t("income.item06").toString(),
align: "center",
sortable: false,
value: "userID"
},
{
text: this.$t("income.item07").toString(),
align: "end",
sortable: false,
value: "nickname"
},
{
text: this.$t("income.item08").toString(),
align: "end",
sortable: false,
value: "money"
},
{
text: this.$t("income.item09").toString(),
align: "end",
sortable: false,
value: "exp"
}
];
// Dummy Data
this.incomeLogData = [
{
"userID":"ACEJTH1",
"nickname":"aceth1",
"money":2000,
"exp":8000,
},
{
"userID":"aceSK1",
"nickname":"acesk1",
"money":2000,
"exp":8000,
}
];
// get excel button
excelDown() {
const dataWS = XLSX.utils.json_to_sheet(this.incomeLogData);
const wb = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, dataWS, 'nameData');
XLSX.writeFile(wb, 'example.xlsx');
}
}
</script>
And I attached my dev tool error. [enter image description here][1] [1]: https://i.stack.imgur.com/2rEL1.png
Solution 1:[1]
I had this trouble with the 0.18.5 version. Uninstall an rollback to version 0.17.3. Everything worked fine!
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | ApoRam |