vue导出数据excel
- 下载两个依赖
npm install file-save xlsx
创建两个文件
Blob.js与Export2Excel.js参考地址:文件地址
在
Export2Excel.js中修改引入地址,注意地址的路径,没有script-loader依赖的话就去npm install script-loader -D下载该依赖

在vue文件中使用
引入文件:
import {
export_json_to_excel
} from '@/plugins/Export2Excel'
点击按钮时导出文件
<a-button @click="exportExcel">导出</a-button>
exportExcel() {
const excelHeader = this.columns.map(item => item.title)
const keys = this.columns.map(item => item.dataIndex)
const excelData = this.dataSource.map(item => keys.map(i => item[i] || ''))
const excelName='人员信息表'
export_json_to_excel(excelHeader, excelData, excelName)
},
对于export_json_to_excel()中几个变量的解释
excelHeader为导出数据的表头
excelHeader=['年龄','性别','姓名']
excelData为导出的数据
excelData=[
[16,'男','tom'],
[17,'男','jim'],
[12,'男','jon'],
[16,'男','king']
]
//数据的顺序与表头一致
excelName:表的名字
vue导出数据excel的更多相关文章
- 导出数据excel表--身份证号后三位是0--〉还原
导出数据excel表的身份证号后三位是0,怎么办? 数据导出前,在身份证号前加任意符号即可 例如: 结果
- PB导出数据excel格式dw2xls
PB导出数据excel格式dw2xls 使用DW2XLS控件 语法 uf_save_dw_as_excel ( dw, filename ) 參数 dw A reference to the data ...
- java导出数据EXCEL的工具类(以spring-webmvc-4.0.4jar为基础)
1.本工具类继承于 spring-webmvc-4.0.4jar文件心中的一个类 AbstractExcelView 2.代码如下 package com.skjd.util; import j ...
- 用MYSQLworkbench导出数据excel
步骤: 1.先从数据库中将表导出,右键需要导出的表格——>Table Data Export Wizard 2.点击Next,选择你需要把数据存放的文件路径.导出的数据格式(表格的话就默认选择C ...
- Excel导出数据Excel.Application组件权限设置方法
很多网络应用系统都会涉及到数据采用Excel方式导出的模块,部分朋友问我到底怎么弄,其实方式很多种,目前比较优秀的方式还是直接用Excel的Excel.Application方式比较合适. 采用Exc ...
- java导出数据Excel总结
//创建获取到JFileChooser的文件名的JTextField public JTextField getTextField(Container c){ JTextField textField ...
- 【js-xlsx和file-saver插件】前端导出数据到excel
最近在做项目,前端进行处理数据,导出excel中,还是遇到不少问题,这里将其进行总结一下,博主是vue框架开发,借用file-saver和xlsx插件进行导出excel,我们来看下代码和效果.地址链接 ...
- vue中把table导出表格excel
1.首先下载2个js,我的百度网盘有 2.安装依赖 npm install -S file-saver xlsx(这里其实安装了2个依赖) npm install -D script-loader 3 ...
- vue 导出excel表格
对于涉及到数据比较多的管理后台导出excel 表格这个需求就非常的常见了 所以? vue 怎么到处excel表格的? 有两种办法 1:请求接口后台直接给你的是excel文件,你需要做的就是怎么接收ex ...
随机推荐
- std::thread线程库详解(4)
目录 目录 前言 条件变量 一些需要注意的地方 总结 前言 本文主要介绍了多线程中的条件变量,条件变量在多线程同步中用的也比较多.我第一次接触到条件变量的时候是在完成一个多线程队列的时候.条件变量用在 ...
- HDOJ 1348 基本二维凸包问题
这次写的凸包用的是Graham scan算法 就数据结构上只是简单地运用了一个栈 #include<stdio.h>#include<cmath>#include<alg ...
- 【uva 1515】Pool construction(图论--网络流最小割 模型题)
题意:有一个水塘,要求把它用围栏围起来,每个费用为b.其中,(#)代表草,(.)代表洞,把一个草变成洞需要费用d, 把一个洞变成草需要费用f.请输出合法方案中的最小费用. 解法:(不好理解...... ...
- hdu 6814 Tetrahedron 规律+排列组合逆元
题意: 给你一个n,你需要从1到n(闭区间)中选出来三个数a,b,c(可以a=b=c),用它们构成一个直角四面体的三条棱(可看图),问你从D点到下面的三角形做一条垂线h,问你1/h2的期望 题解: 那 ...
- GCD HDU - 1695 容斥原理(复杂度低的版本)
题意: 让你从区间[a,b]里面找一个数x,在区间[c,d]里面找一个数y.题目上已经设定a=b=1了.问你能找到多少对GCD(x,y)=k.x=5,y=7和y=5,x=7是同一对 题解: 弄了半天才 ...
- GYM101810 ACM International Collegiate Programming Contest, Amman Collegiate Programming Contest (2018) M. Greedy Pirate (LCA)
题意:有\(n\)个点,\(n-1\)条边,每条边正向和反向有两个权值,且每条边最多只能走两次,有\(m\)次询问,问你从\(u\)走到\(v\)的最大权值是多少. 题解:可以先在纸上画一画,不难发现 ...
- .NET并发编程-函数闭包
本系列学习在.NET中的并发并行编程模式,实战技巧 内容目录 函数式编程闭包的应用记忆化函数缓存 函数式编程 一个函数输出当做另一个函数输入.有时候一个复杂问题,我们拆分成很多个步骤函数,这些函数组合 ...
- SpringBoot整合Swagger初探
当下的Web项目大都采用前后端分离+分布式微服务的架构.前后端分离式的开发中,前端开发人员要与后端开发人员协商通信接口,约定接口规范.因此对于开发人员来说能够维持一份及时更新且完整全面的API文档会大 ...
- Logstash 日志收集(补)
收集 Tomcat 日志 安装 Tomcat # 安装 jdk [root@web01 ~]# rpm -ivh jdk-8u181-linux-x64.rpm # 下载 [root@web01 ~] ...
- Python append() 与深拷贝、浅拷贝
在leetcode77中,发现list.append的结果不对.原代码: class Solution: def combine(self, n: int, k: int) -> List[Li ...