vue element 导出 分页数据的excel表格
2024-09-24 16:27:56
1.安装相关依赖
npm install --save xlsx file-saver
2.导入相关插件
在组建头部导入相关插件
const FileSaver = require("file-saver")
const XLSX = require("xlsx")
3.调用相关的方法
var wb = XLSX.utils.table_to_book(document.querySelector("#tableBox"))
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
try {
FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
} catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
4.分页的数据导出
// 执行下载
async activeExportOut(){
// this.ableExportOut = true //设置可以下载
this.oldtableData = this.tableData //保存起就数据
await this.setData()
this.exportOut()
},
setData(){
this.tableData = test //赋值新数据
},
//下载表格
exportOut(){
var wb = XLSX.utils.table_to_book(document.querySelector("#tableBox"))
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
try {
FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
} catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) } // this.ableExportOut = false //设置不可下载
this.tableData = this.oldtableData //回复原来说的数据
return wbout
}
最新文章
- PHP之Memcache缓存详解
- ASP.NET使用ConfigurationSection在Web.Config创建自定义配置节
- iOS 直播类APP开发流程分解:
- CSS 有关margin padding
- java并发编程-线程池的使用
- python之路之正则表达式
- saltstack实战4--综合练习3
- L011-oldboy-mysql-dba-lesson11
- 【HDU1712】ACboy needs your help(分组背包)
- 微信分享jssdk config:invalid signature 签名错误
- redis(一)简介
- Winform调用WebKitBrowser,基于chrome内核WebKit的浏览器控件
- sitemesh网页布局
- 利用Python进行数据分析——重要的Python库介绍
- Hadoop综合大作业
- web服务器软件
- 第二周博客作业 <;西北师范大学| 周安伟>;
- Scikit-learn使用总结
- ASP.NET MVC中实现属性和属性值的组合,即笛卡尔乘积02, 在界面实现
- PPAS可以安装分区表
热门文章
- #python#return和print的一些理解
- 【leetcode】Find Largest Value in Each Tree Row
- Fiddler的工作原理与主菜单介绍(一)
- 18. ClustrixDB 管理CPU资源
- window.location.hash(hash应用)---跳转到hash值制定的具体页面
- python中pip相关命令
- OverFeat:基于卷积网络的集成识别、定位与检测
- vue之Object.defineProperty()
- [BZOJ2111]:[ZJOI2010]Perm 排列计数(组合数学)
- Vue知识整理13:表单输入绑定(v-model)