使用vue导出excel文件
今天再开发中遇到一件事情,就是怎样用已有数据导出excel文件,网上有许多方法,有说用数据流的方式,https://www.cnblogs.com/yeqrblog/p/9758981.html,但是现在我的想法是只是用数组数据,不接著与数据流的方式去实现,事实证明是可以的:
1.安装依赖
- //npm
- npm install -S file-saver xlsx
- npm install -D script-loader
2.在main.js中进行导入Bolb.js与Export2Excel.js
两个js文件地址:
链接:https://pan.baidu.com/s/1ib2Ox18FngVlhKxs6l8OZQ
提取码:sirm
- import Blob from './excel/Blob'
- import Export2Excel from './excel/Export2Excel.js'
3.在组件中使用
- //导出的方法
- exportExcel() {
- require.ensure([], () => {
- const { export_json_to_excel } = require('../excel/Export2Excel');
- const tHeader = ['序号', '昵称', '姓名'];
- // 上面设置Excel的表格第一行的标题
- const filterVal = ['index', 'nickName', 'name'];
- // 上面的index、nickName、name是tableData里对象的属性
- const list = this.tableData; //把data里的tableData存到list
- const data = this.formatJson(filterVal, list);
- export_json_to_excel(tHeader, data, '列表excel');
- })
- },
- formatJson(filterVal, jsonData) {
- return jsonData.map(v => filterVal.map(j => v[j]))
tHeader是表头,filterVal 中的数据是表格的字段,tableData中存放表格里的数据,类型为数组,里面存放对象,表格的每一行为一个对象。
如此,就可以了。
使用vue导出excel文件的更多相关文章
- vue导出Excel文件
1.需要安装file-saver和script-loader.xlsx npm install file-saver / yarn add file-saver npm install script- ...
- axios + vue导出excel文件
(使用到了elementUI框架) <template> <el-button type="primary" size="mini" @cli ...
- 基于Vue + axios + WebApi + NPOI导出Excel文件
一.前言 项目中前端采用的Element UI 框架, 远程数据请求,使用的是axios,后端接口框架采用的asp.net webapi,数据导出成Excel采用NPOI组件.其业务场景,主要是列表页 ...
- vue+element 表格导出Excel文件
https://www.cnblogs.com/bobodeboke/p/8867481.html 非常感谢 这个大佬 才让我搞到了Blob.js 和 Export2Excel.js 如果最后运行时 ...
- 如何使用JavaScript实现前端导入和导出excel文件
一.SpreadJS 简介 SpreadJS 是一款基于 HTML5 的纯 JavaScript 电子表格和网格功能控件,以“高速低耗.纯前端.零依赖”为产品特色,可嵌入任何操作系统,同时满足 .NE ...
- 纯前端实现数据导出excel文件
一 安装依赖 npm install -S file-saver xlsx npm install -D script-loader 二 新建文件夹 在网上百度引入即可 三 在main.js中引入 ...
- ExtJS Grid导出excel文件
ExtJS Grid导出excel文件, 需下载POI:链接:http://pan.baidu.com/s/1i3lkPhF 密码:rqbg 1.将Grid表格数据连同表格列名传到后台 2.后台导出e ...
- PHP从数据库导出EXCEL文件
参考博客链接:http://www.cnblogs.com/huangcong/p/3687665.html 我的程序代码 原生导出Excel文件 <?phpheader('Content-ty ...
- jxl导出Excel文件
一.java项目实现读取Excel文件和导出Excel文件 实现读取和导出Excel文件的代码: package servlet; import java.io.FileInputStream; im ...
随机推荐
- Nginx内置变量以及日志格式变量
$args #请求中的参数值$query_string #同 $args$arg_NAME #GET请求中NAME的值$is_args #如果请求中有参数,值为"?",否则为空字符 ...
- Eclipse的server选项卡中找不到tomcat配置项
1.在Eclipse中,如果想开发j2ee,必须要先安装插件.至于具体的插件安装方法,这里不再赘述. 2.当进行到配置tomcat服务器的时候,有时候会出现这种情况: 3.在server选项卡的Run ...
- git 清空所有commit记录
说明:例如将代码提交到git仓库,将一些敏感信息提交,所以需要删除提交记录以彻底清除提交信息,以得到一个干净的仓库且代码不变 1.Checkout git checkout --orphan late ...
- COSO企业风险管理框架及其在大宗商品行业的应用
https://mp.weixin.qq.com/s/P1NDvqsz0GNObm1pb47mfg 中国期货市场交易量领先全球,期权.互换等新的衍生品工具逐步引入,场外衍生品服务商正在涌现.越来越多的 ...
- 史上最全的CSP-J/S 第一轮知识点
CSP-J/S 第一轮知识点选讲 \(NOIP\)(全国青少年信息学奥林匹克竞赛)于2019年取消.取而代之的是由\(CCF\)推出的非专业级软件能力认证,也就是现在的\(CSP-J/S\).作为一名 ...
- $O(k^2)$ 求前缀 $k$ 次幂和(与长度无关)
接下来求解前缀幂次和 求解 \(\sum_{i = 1}^{k} i^k\) \[ \begin{aligned} (p+1)^k - 1 = (p+1)^k - p^k + p^k - (p-1)^ ...
- [LeetCode] 916. Word Subsets 单词子集合
We are given two arrays A and B of words. Each word is a string of lowercase letters. Now, say that ...
- 关于Design Complier/Library Compiler的跌坑(坑爹)记录
最近需要用DC做一些事,然后需要转库,中午偷个闲,特来记录一下中间的一些坎坷. 1.首先是要转库.我们只有.lib文件的格式,所以需要把.lib文件转换成.db格式.然后坑来了!!!DC2015及以后 ...
- Comet OJ - Contest #7 C 临时翻出来的题(容斥+状压)
题意 https://www.cometoj.com/contest/52/problem/C?problem_id=2416 思路 这里提供一种容斥的写法(?好像网上没看到这种写法) 题目要求编号为 ...
- 写了此书《微软Azure实战参考》 北京航空航天大学出版社 2019年7月
经过大半年的努力,写出了此书<微软Azure实战参考> 北京航空航天大学出版社 2019年7月.喜爱微软云平台和需要使用微软云技术的读者,可以参考一下.