篇首语:本文由小编为大家整理,主要介绍了vue 预览 Excel 表格相关的知识,希望对你有一定的参考价值。
1、安装插件npm i xlsx
2、示例
<template> <p > <p v-html="tableau"></p> </p></template><script>import axios from \"axios\"import XLSX from "xlsx";export default { data(){ return { tableau: null, } }, mounted(){ axios.get(\"/xlsx\",{ responseType: "arraybuffer", // 设置响应体类型为arraybuffer }).then(({data})=> { let workbook = XLSX.read(new Uint8Array(data), {type:"array"}); // 解析数据 var worksheet = workbook.Sheets[workbook.SheetNames[0]]; // workbook.SheetNames 下存的是该文件每个工作表名字,这里取出第一个工作表 this.tableau = XLSX.utils.sheet_to_html(worksheet); // 渲染 }) }}</script>
- 以上方法简单的渲染成表格,需要自己修改样式,需要编辑功能可以去看xlsx的api文档
以上是关于vue 预览 Excel 表格的主要内容,如果未能解决你的问题,请参考以下文章