vue2 Excel导出数据 js-xlsx的使用
vue2 Excel导出数据 js-xlsx的使用
大多数文章写出的都是打包的项目配合js-xlsx使用的Excel导出方法,对于普通引用vue写出的页面配合js-xlsx导出页面却没有教程,其实很简单,今天分享一下教程
js-xlsx 地址 https://github.com/SheetJS/js-xlsx
<script src="./shim.min.js"></script>
<script src="./xlsx.full.min.js"></script>
再像以上这样引用之后,然后就是导出的函数了,主要就是要按照它的数据格式来
function exportExcel(excelname){
var self = this;
var _data = [
[ "id", "name", "value" ],
[ 1, "sheetjs", 7262 ],
[ 2, "js-xlsx", 6969 ]
];
var worksheet = XLSX.utils.aoa_to_sheet(_data);
var new_workbook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(new_workbook, worksheet, excelname?excelname:"SheetJS");
XLSX.writeFile(new_workbook, excelname?(excelname+'.xlsx'):"sheetjs.xlsx");
}
以上函数中,_data里就是示例数据,必须将你的数据按照它的规格格式化,导出才会没有问题,其中_data的第一个数组是表格列名称数组,然后下面的 数组是数据数组,试试吧,有问题可以call我,希望对你有帮助
vue2 Excel导出数据 js-xlsx的使用的更多相关文章
- Excel向数据库插入数据和数据库向Excel导出数据
为了熟悉java里工作簿的相关知识点,所以找了“Excel向数据库插入数据和数据库向Excel导出数据”的功能来实现. 注意事项:1,mysql数据库: 2,需要导入的jar包有 jxl.jar,my ...
- JAVA实现Excel导出数据(以写好的Excel模版导出)
工作中经常会有将后台数据以Excel导出的功能. 简单的方法有将response的contentType设置为application/vnd.ms-excel: 或在JSP页面直接设置成: <% ...
- 通过Workbook类 生成Excel导出数据
需求: 实现错误信息生成Excel保存到本地让用户查看. 刚开始使用了微软自带的Microsoft.Office.Interop.Excel类库. Microsoft.Office.Interop.E ...
- Excel导出数据Excel.Application组件权限设置方法
很多网络应用系统都会涉及到数据采用Excel方式导出的模块,部分朋友问我到底怎么弄,其实方式很多种,目前比较优秀的方式还是直接用Excel的Excel.Application方式比较合适. 采用Exc ...
- 使用html替代excel导出数据的优势和技巧
之前一直使用NPOI或者微软office官方组件导出excel,但是多多少少会有写小问题,不是数据量不能过大(xls的问题,用xlsx就可以更大了),就是速度慢,或者文件体积太大 中途采用过csv(逗 ...
- thinkphp5中使用excel导出数据表格(包涵图片)
首先使用composer require phpoffice/phpexcel下载安装phpexcel包. 将包放入extend下面. 不附加图片的导出 /** * 导出excel(不带图片) * @ ...
- Thinkphp实现excel导出数据
前端: 点击导出触发click事件,传值export指令和args关键字(args是指我们是否有查询取哪些数据)到控制器 $(document).on("click", " ...
- 利用Aspose.Cells完成easyUI中DataGrid数据的Excel导出功能
我准备在项目中实现该功能之前,google发现大部分代码都是利用一般处理程序HttpHandler实现的服务器端数据的Excel导出,但是这样存在的问题是ashx读取的数据一般都是数据库中视图的数据, ...
- Delphi实现带有格式的Excel导出功能
功能预览 运行预览 模板样式 存储返参 导出的Excel 2. 代码实现 //执行sql的函数 procedure TForm1.GetReportData(astrsql:string); var ...
随机推荐
- 组件向外暴露v-model绑定的参数
<template> <div class="search-box"> <i class="icon-search">< ...
- 洛谷P1991 无线通讯网(最小生成树性质+连通块)
题目描述 国防部计划用无线网络连接若干个边防哨所.2 种不同的通讯技术用来搭建无线网络: 每个边防哨所都要配备无线电收发器:有一些哨所还可以增配卫星电话. 任意两个配备了一条卫星电话线路的哨所(两边都 ...
- codeforces Round #611
这种凌晨场真的折寿 就过了四题,8wa结尾心态炸裂,求别被hack,再hack就要爬了 A2 B8 C38(1) E1:58(7) D题感觉可以写,但是没有时间看了.幸好E最后发现了自己的 ...
- 树莓派4B踩坑指南 - (7)root账户及权限设置
树莓派启用root账户 树莓派默认用户是pi 密码为raspberry. root账户默认无密码,但是账户锁定. 开启root账户命令: sudo passwd root #执行后提示设置密码,输入2 ...
- nginx反向代理实战之轮询、Ip_hash、权重
实验环境 192.168.200.111 web1 centos7 192.168.200.112 web2 centos7 192.168.200.113 wev3 centos7 三台主机环境: ...
- 基于 Chrome 浏览器的扩展插件来进行的安装Postman
我会给你一个安装包,见附件.你应该下载下来,解压缩到你喜欢的位置. 打开 Chrome 浏览器的「扩展程序」 点击「加载已解压的扩展程序...」按钮,找到你刚刚下载的安装包的位置,点击确定. 你去看看 ...
- Plastic Sprayers Manufacturer - Spray Principle, Spray Note
The Plastic Sprayers Manufacturer stated that the spray is artificial fogging. Simply put, th ...
- PAT T1022 Werewolf
暴力搜索加剪枝~ #include<bits/stdc++.h> using namespace std; ; int a[maxn]; bool visit[maxn]; vector& ...
- 【转载】script命令使用
二.script命令简介当你在终端或控制台上工作时,你可能想记录下自己做了些什么.这种记录可以看成是保存了终端痕迹的文档.假设你跟一些Linux管理员同时在系统上干活.或者说你让别人远程到你的服务器. ...
- nginx 的四层代理
需要编译四层模块 [root@python vhast]# cd ~/nginx-1.15.9/ [root@python nginx-1.15.9]# ./configure --prefix=/d ...