vue中导出表格数据

项目中使用了 element-UI ,需要导出表格中的数据,主要用到了两个依赖:xlsx ,file-saver 。
相关git : https://github.com/SheetJS/js-xlsxhttps://github.com/eligrey/FileSaver.js

  1. 安装依赖
npm install --save xlsx file-saver
  1. 组件中引入
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
  1. 添加一个方法
exportExcel () {
      //在导出的过程中发现数字的格式发生了变化,可以通过添加参数解决 
      var xlsxParam = { raw: true };//转换成excel时,使用原始的格式
     // 需要导出的table的DOM节点 
     var wb = XLSX.utils.table_to_book(document.querySelector('#out-table'), xlsxParam)
     var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
     try {
    // sheetjs 导出的文件名,可以根据需要修改
    FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
  } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
         return wbout
     },
  1. 执行方法就可以得到表格对应的数据。
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • # Python 资源大全中文版 我想很多程序员应该记得 GitHub 上有一个 Awesome - XXX 系列...
    小迈克阅读 3,063评论 1 3
  • 1.图片浏览控件MWPhotoBrowser 实现了一个照片浏览器类似 iOS 自带的相册应用,可显示来自手机的图...
    万忍阅读 1,527评论 0 6
  • 2017的中超,大牌云集,比赛精彩纷呈。可以说是近些年了最好看的一年比赛之一了。精彩的比赛肯定会衍生出很多有意思的...
    枫桥落夜阅读 600评论 0 1
  • 中午刚放学就听小朋友们说下雪啦下雪啦。只见空中一粒粒细小的雪花从天而降,飘飘洒洒的落下来。我忍不住伸手去接...
    联合小学刘彦君阅读 163评论 0 0
  • 原文: 有物混成,先天地生。寂兮寥兮,独立而不改,周行而不殆,可以为天地母。吾不知其名,字之曰道,强为之名曰大。大...
    摆渡彼岸阅读 1,343评论 0 2