我正在尝试上传xlsx excel 文件并在我的 Vue 应用程序中处理它。但它失败了,抛出一个错误。这让我认为我没有正确使用或导入库,因为在节点项目中工作正常。
我正在使用xlsx库。
模板
<template>
<div id="app">
<input type="file" @change="onChange" />
</div>
</template>
Run Code Online (Sandbox Code Playgroud)
脚本
import XLSX from "xlsx"
export default {
name: "App",
methods: {
onChange(event) {
this.file = event.target.files ? event.target.files[0] : null;
let workbook = XLSX.readFile(this.file);
console.log('workbook1');
console.log(workbook);
console.log('SheetNames');
console.log(workbook.SheetNames);
},
}
};
Run Code Online (Sandbox Code Playgroud)
在这一点上,即使有一个正确的库(如果有的话),我们也会非常感激。提前致谢。
这是我的问题代码和框:
https://codesandbox.io/s/nervous-montalcini-w3qhy?file=/src/App.vue
我需要对 Vuetify 自动完成进行无限分页。当我滚动到菜单末尾时,从后端加载新的项目页面。
我尝试v-intersect像这样使用指令:
<template>
<v-autocomplete
:items="aBunchOfItems"
item-text="theText"
item-value="theValue"
label="AutoComplete Test"
>
<template v-slot:append-item>
<div v-intersect="onIntersect">
Loading more items ...
</div>
</template>
</v-autocomplete>
</template>
<script>
export default {
methods: {
onIntersect () {
console.log('lol')
},
},
}
</script>
Run Code Online (Sandbox Code Playgroud)
但是,onIntersect()当我单击自动完成功能时,而不是滚动到附加项目时,就会调用该函数。我还尝试了v-lazy将附加项目 div 包装在其中的指令,但这也不起作用。有什么方法可以做到这一点吗?