vue2 Excel导出数据 js-xlsx的使用

https://www.jianshu.com/p/ea115a8e9107
小世界最温暖 关注

2018.11.19 16:08 字数 280 阅读 422评论 0喜欢 0

大多数文章写出的都是打包的项目配合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的使用的更多相关文章

  1. Excel向数据库插入数据和数据库向Excel导出数据

    为了熟悉java里工作簿的相关知识点,所以找了“Excel向数据库插入数据和数据库向Excel导出数据”的功能来实现. 注意事项:1,mysql数据库: 2,需要导入的jar包有 jxl.jar,my ...

  2. JAVA实现Excel导出数据(以写好的Excel模版导出)

    工作中经常会有将后台数据以Excel导出的功能. 简单的方法有将response的contentType设置为application/vnd.ms-excel: 或在JSP页面直接设置成: <% ...

  3. 通过Workbook类 生成Excel导出数据

    需求: 实现错误信息生成Excel保存到本地让用户查看. 刚开始使用了微软自带的Microsoft.Office.Interop.Excel类库. Microsoft.Office.Interop.E ...

  4. Excel导出数据Excel.Application组件权限设置方法

    很多网络应用系统都会涉及到数据采用Excel方式导出的模块,部分朋友问我到底怎么弄,其实方式很多种,目前比较优秀的方式还是直接用Excel的Excel.Application方式比较合适. 采用Exc ...

  5. 使用html替代excel导出数据的优势和技巧

    之前一直使用NPOI或者微软office官方组件导出excel,但是多多少少会有写小问题,不是数据量不能过大(xls的问题,用xlsx就可以更大了),就是速度慢,或者文件体积太大 中途采用过csv(逗 ...

  6. thinkphp5中使用excel导出数据表格(包涵图片)

    首先使用composer require phpoffice/phpexcel下载安装phpexcel包. 将包放入extend下面. 不附加图片的导出 /** * 导出excel(不带图片) * @ ...

  7. Thinkphp实现excel导出数据

    前端: 点击导出触发click事件,传值export指令和args关键字(args是指我们是否有查询取哪些数据)到控制器 $(document).on("click", " ...

  8. 利用Aspose.Cells完成easyUI中DataGrid数据的Excel导出功能

    我准备在项目中实现该功能之前,google发现大部分代码都是利用一般处理程序HttpHandler实现的服务器端数据的Excel导出,但是这样存在的问题是ashx读取的数据一般都是数据库中视图的数据, ...

  9. Delphi实现带有格式的Excel导出功能

    功能预览 运行预览 模板样式 存储返参 导出的Excel 2. 代码实现 //执行sql的函数 procedure TForm1.GetReportData(astrsql:string); var ...

随机推荐

  1. 不要在mutation回调函数之外,修改vuex仓库里属性的状态

    [vuex] do not mutate vuex store state outside mutation handlers. import * as types from './mutation- ...

  2. LeetCode练题——66. Plus one

    1.题目 66. Plus One——easy Given a non-empty array of digits representing a non-negative integer, plus ...

  3. python3实现在二叉树中找出和为某一值的所有路径

    在二叉树中找出和为某一值的所有路径请写一个程序创建一棵二叉树,并按照一定规则,输出二叉树根节点到叶子节点的路径.规则如下:1.从最顶端的根结点,到最下面的叶子节点,计算路径通过的所有节点的和,如果与设 ...

  4. socket 多连接

    socket 多连接 本文档为文档https://www.cnblogs.com/wodeboke-y/p/11241472.html 后续内容. 上一文档中的案例2给出了一个阻塞型socket se ...

  5. java获取当前机器的公网ip

    package com.Interface.util; import javax.servlet.http.HttpServletRequest; /** * 测试类 * * @author 华文 * ...

  6. Nexus-FEX基础配置

    1.FEX基本配置feature fex fex 100  pinning max-links 1  >>>>该值默认就是1  description "FEX100 ...

  7. LNMP架构及应用部署!(重点)

    LNMP代表的就是:Linux系统下Nginx+MySQL+PHP这种网站服务器架构. WNMP代表的就是:Windows系统下Nginx+MySQL+PHP这种网站服务器架构. WAMP代表的就是: ...

  8. php 基础 语句include和require的区别是什么?为避免多次包含同一文件,可用(?)语句代替它们?

    require->require是无条件包含也就是如果一个流程里加入require,无论条件成立与否都会先执行 require include->include有返回值,而require没 ...

  9. C++代码如何附加到C#写的主程序中?

    背景是这样:C#的exe程序,C#中调用C++的dll,也就是所谓的托管吧. C#的exe出了点问题,想在C++的dll的源码中调试,附加到进程时,加了断点,怎么也跟不进去.断点不变红啊,急死了. 最 ...

  10. Vases and Flowers-HDU4614 二分+线段树

    题意: 给你N个花瓶,编号是0  到 N - 1 ,一开始每个花瓶都是空的,你有两个操作: 第一个操作: 从第x个花瓶起开始插花,总共插y束,如果遇到花瓶中有花就跳过这个花瓶,直到花插完或者 插到第N ...