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 ...
随机推荐
- 无线连接网络-FAST SSID Change
这篇随笔主要记录的是Apple设备连接思科无线可能出现的问题,尤其是在思科WLC3504下部署的无线网络,这种故障体现的尤为明显. For Single SSID To support Apple i ...
- vue.js 强行赋值、刷新数组或者对象 方法之 $.set()
实际开发过程中,数据交互的的时候需要赋值,刷新,但是不可能每次赋值之后都刷新整个页面,所以就要用到 vue.js方法 $.set(),能实现赋值对象的局部刷新 语法:Vue.set(object, k ...
- 「Luogu P5080 Tweetuzki 爱序列」
题目大意 给出一些数,需要求出 \(\frac{a_{i+1}}{3}=a_i\) 或 \(a_{i+1}=2 \times a_i\) 时最长的序列 \(a\). 分析 可以发现符合条件的序列 \( ...
- 安装插件报错error: Microsoft Visual C++ 14.0 is required. Get it with "Microsoft Visual C++
起因:学到多线程greenlet模块时,greenlet模块死活装不上,以为pycharm坏掉了,浪费了一下午. #pip3 install greenlet from greenlet import ...
- windows与linux的文件路径
在windows操作系统中,文件路径的分隔符是反斜杠(“\\”),例如: E:\\hsta\\pdf(这里为防止转义,所以要写成两个反斜杠) 但是在linux操作系统中,文件的分隔符是斜杠(“/”), ...
- Wcf托管在IIS中,HttpContext.Current为空
config中需要配置 <serviceHostingEnvironment aspNetCompatibilityEnabled="true"/> 另需要在服务类上加 ...
- 【网摘】模仿 placeholder 属性
/*为空时显示 element attribute content*/ .project-task-edit .subtask-body-txt:empty:before { content: att ...
- How2J学习java-1、环境配置
JDK环境变量配置分下载,配置,验证三个步骤. 一.首先需要到JDK下载网站下载所需的JDK版本可根据更新来定.主流的开发工具Idear下载. 1.首先看配置成功后的效果 点WIN键->运行(或 ...
- 【转载】Eclipse vs IDEA快捷键对比大全(win系统)
花了几天时间熟悉IDEA的各种操作,将各种快捷键都试了一下,感觉很是不错! 以下为我整理了一下开发过程中经常用的一些Eclipse快捷键与IDEA的对比,方便像我一样使用Eclipse多年但想尝试些改 ...
- 怎么HTML表格中的所有字体居中?
一开始,我在table标签里加入align="center" 发现没什么用.... 后来在css里加入,就可以了 成果如图: