vue2.0 + element UI 中 el-table 数据导出Excel的方法

前端之家收集整理的这篇文章主要介绍了vue2.0 + element UI 中 el-table 数据导出Excel的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1、安装相关依赖

主要是两个依赖

如果想详细看着两个插件使用,请移步github。

2、组件里头引入

3、组件methods里写一个方法

注意:XLSX.uitls.table_to_book( 放入的是table 的DOM 节点 ) ,sheetjs.xlsx 即为导出表格的名字,可修改

4、点击导出按钮执行 exportExcel 的方法即可 。

组件里头代码截图:

实现效果图如下:

导出如下表格的数据到excel。

导出到excel 表格,结果如下:

相关链接

该工具的其他使用场景( 如react 、jQ、angular ) http://sheetjs.com/

以上这篇vue2.0 + element UI 中 el-table 数据导出Excel的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

猜你在找的Vue相关文章