欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 文旅 > 旅游 > vue使用js-xlsx导入本地excle表格数据,回显在页面上

vue使用js-xlsx导入本地excle表格数据,回显在页面上

2024/11/30 10:46:46 来源:https://blog.csdn.net/qq_46131497/article/details/142858957  浏览:    关键词:vue使用js-xlsx导入本地excle表格数据,回显在页面上

效果图
在这里插入图片描述
解释放在代码的注释中
页面代码,导入本地文件我用的是element的上传工具
在这里插入图片描述
在这里插入图片描述

// 我是根据js文件直接引入的
<script src="/js/xlsx.full.min.js"></script>// 导入excelreadWorkbookFromLocalFile(fileData) {// 文件信息const file = fileData;const reader = new FileReader();reader.onload = (e) => {const data = new Uint8Array(e.target.result);const workbook = XLSX.read(data, { type: 'array' });// 因为excle分很多页数,找到你对应的那一页const sheetName = workbook.SheetNames.filter(item => item == "待购进");const worksheet = workbook.Sheets[sheetName[0]];// 获取那一页的数据,XLSX.utils.sheet_to_csv这个方法返回的是字符串格式,可以打断点来看数据格式const jsonData = XLSX.utils.sheet_to_csv(worksheet);// const jsonData = XLSX.utils.sheet_to_json(worksheet);// 后面就是根据返回的数据格式,处理成自己需要的代码格式let newData = jsonData.split('\n')newData.splice(0, 2)newData.splice(newData.length - 1)console.log(newData, "123")};reader.readAsArrayBuffer(file);},

这链接是详细的说明这个js-xlsx的,可以看看这个
https://www.cnblogs.com/ajaemp/p/12880847.html

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com