记录一下近期使用js-xlsx的一些经验

真正的.xls\.xlsx文件,就算是空白的其实是包含了一些内容的

所以并不能直接像写入txt一样直接搞一个file往里面把数据写入就完了

现在网上查得到导出excel的一些方法:

1、在IE上使用ActiveXObject导出文件

由于我们客户端是基于chorme的,所以没有做尝试

2、导出csv文件

如果是比较简单的表格(没有表格单元格合并等需求),其实csv文件也是一个不错的选择(当然前提是你不介意这个文件是csv文件)。需求比较介意,所以没有对csv进行尝试

3、导出伪.xls\.xlsx文件

①对html代码进行格式化,最后生成一串uri文件链接,再通过标签进行下载

//let uri = 'data:application/vnd.ms-excel;base64,'

//let template =

//'

//'xmlns:x="urn:schemas-microsoft-com:office:excel" ' +

//'xmlns="http://www.w3.org/TR/REC-html40">

' +

//'

'

//let base64 = (s: any) => {

//return window.btoa(unescape(encodeURIComponent(s)))

//}

//let format = (s: any, c: any) => {

//return s.replace(/{(\w+)}/g, (m: any, p: any) => {

//return c[p]

//})

//}

//let tableHTML = table[0].innerHTML + table[1].innerHTML

//let ctx = {

//worksheet: '统计',

//table: tableHTML.replace(//g, '') // 筛选掉

//}

//let downloadLink = document.createElement('a')

//downloadLink.href = uri + base64(format(template, ctx))

//downloadLink.download = '成绩统计.xls'

//downloadLink.click()

这种大概可以保留行内样式,比如字体颜色、字体粗细等,但是对单元格格式进行控制(有些全数字的字符串过长会被识别成科学计数法),网上很多说可以用style="mso-number-format:\\@;",尝试了之后并不可行

②当然还有一种是可以不用对html进行格式化

因为excel可以识别html代码,可以跳过方法①中对html进行格式化的步骤,直接将html导出

  //避免中文乱码

标题1 标题2 标题3 标题4
内容1 内容2 内容3 内容4

excel也可以展示出来效果,但是打开之前会提示文件格式和扩展名不匹配,也就是说,这只是一个披着.xls扩展名的html文件,所以它连基本的单元格边框都没有,除非你在table里写上border="1"

③另外还有一种,更简单,直接

以上三种方法生成的全是伪xls,因为他们没有excel文件里那7kb内容,所以就算拓展名改成.xls\.xlsx,也只是一个假的文件

4、使用js-xlsx库,实现真正的.xls\.xlsx导出

参考https://github.com/SheetJS/js-xlsx

①安装

npm install xlsx

或者

bower install js-xlsx

②导入

官方github上有给各种框架的demo:

可以根据项目框架选择导入方式,这里是vue:

import XLSX from 'xlsx'

③使用

let workbook =XLSX.utils.table_to_book(wholeTable)

let xls=XLSX.write(workbook, {

bookType:'xls', //生成的文件格式

bookSST: false, //是否生成Shared String Table,官方解释是,如果开启生成速度会下降,但在低版本IOS设备上有更好的兼容性

type: 'base64', //编码方式

})

这里xlsx提供了多种方法:

写入:

aoa_to_sheet将JS数组的数组([ [...],[...],[...] ])转换为工作表

json_to_sheet将json对象数组转换为工作表

table_to_sheet将DOM TABLE元素转换为工作表

sheet_add_aoa将JS数据数组添加到现有工作表中

sheet_add_json将json对象数组添加到现有工作表中

读取:

sheet_to_json将工作表对象转换为JSON对象数组

sheet_to_csv将工作表转换成csv

sheet_to_txt生成UTF16格式的文本

sheet_to_html生成HTML输出

sheet_to_formulae生成公式列表(具有值回退)

单元格和单元格地址操作:

format_cell生成单元格的文本值(使用数字格式)

encode_row / decode_row在0索引行和1索引行之间转换

encode_col / decode_col在0索引列和列名之间进行转换

encode_cell / decode_cell转换单元格地址

encode_range / decode_range转换细胞范围

可以说是肥肠强大了

js导出的xlsx无法打开_js-xlsx实现文件导出、下载(excel)相关推荐

  1. js导出的xlsx无法打开_js文件操作之——导出Excel (js-xlsx)

    前阵子跟server同学讨论一个Excel导出的需求,我说JS搞不定,需要server来做,被server同学强行打脸. 今天研究了下,尼玛,不光可以,还很强大了! 总结:经验是害人的,尤其是在发展迅 ...

  2. js导出的xlsx无法打开_使用FileSaver、js-xlsx实现excel导出

    需要将页面上的表格内容导出成excel格式. 使用了FileSaver.js-xlsx的前端插件. files: [ vendor_path('file-saver/FileSaver.min.js' ...

  3. 让IE不自动打开Excel文件而是下载excel文件

    我的电脑上安装了Office,所以IE会直接在浏览窗口里打开Excel文件.请问怎样才能避免标题情况呢? 1---------------------- <% Response.ContentT ...

  4. 基于vue.js的饿了么的element-ui的unpkg文件的下载到本地

    现在vue.js使用很广泛,饿了么的element-ui基于vue.js开发的ui框架.官方提供了unpkg的访问地址https://unpkg.com/element-ui@2.4.6/.可以直接在 ...

  5. cvs数据格式 gps_运动手表GPS轨迹文件导出方法

    运动手表GPS轨迹文件导出方法 什么是GPS轨迹文件? 记录运动轨迹是带GPS运动设备最基本的功能,记录轨迹后才能计算配速(速度).距离,间接数据还有步幅.最大摄氧量等数据.带GPS功能运动设备比较常 ...

  6. sqlite3导出csv首位0_运动手表GPS轨迹文件导出方法

    运动手表GPS轨迹文件导出方法 什么是GPS轨迹文件? 记录运动轨迹是带GPS运动设备最基本的功能,记录轨迹后才能计算配速(速度).距离,间接数据还有步幅.最大摄氧量等数据.带GPS功能运动设备比较常 ...

  7. Summary - 文件导出测试

    导出测试: 思路:分为导出前,导出时,导出后三个阶段 导出前: 1. 两种状态: 文件不可下载/ 文件可下载 2.测试范围 1) 文件是否运行到可下载状态(比如status: complete) 2) ...

  8. 微信中如何导入html文件夹,如何把微信收藏的文件导出到电脑?微信收藏导入到电脑的有效方法...

    因为工作原因,现在有很多人每天都要同时登陆电脑版和手机版的微信,但是不同平台的微信在有些方面的数据不是互通的,所以就有很多用户不知道手机微信中的文件怎么才能导出到电脑上,对于这个问题,智机之家小编在下 ...

  9. 巧用千寻位置GNSS测绘软件| 数据文件导出技巧

    日常进行测量放样或者是静态数据采集等作业时,都需要将这些数据进行导出.使用千寻位置GNSS测绘软件可快速完成项目数据和道路断面的数据导出.本期带来具体的操作技巧,方便测绘朋友在短时间内完成数据文件导出 ...

最新文章

  1. linux命令行3d,Linux命令行快捷键
  2. codeforces Gym 100338E Numbers (贪心,实现)
  3. Nginx 入门级配置
  4. 解决代码中重复的捕获 promise 错误的 try catch 语句
  5. 电脑硬盘数据线_这40种电脑故障的排除技巧你都掌握了吗?
  6. jvisualvm命令 Java Virtual Machine Monitoring Troubleshooting
  7. TFS首次安装与配置,极其注意事项个人备用
  8. Scrapy 教程(九)-日志系统
  9. Vue的调试工具(Chrome 浏览器)配置
  10. Linux configure 参数解释
  11. jquery分页插件精选
  12. SQL:pgsql查询geom参考系以及更改geom参考系
  13. 石川:股票多因子模型的回归检验
  14. 阿里面试真题!《阿里云技术面试红宝书》!赶紧保存下载!
  15. 数据库创建图书馆管理系统
  16. Topshelf 打包部署Windows服务
  17. 计划了近半年的跳槽,最终是面试四家,过3家……
  18. 防抖和截流超级详细讲解,易懂
  19. 【时间管理】柳比歇夫之奇特的一生
  20. 【EHub_tx1_tx2_E100】Ubuntu18.04 + ROS_ Melodic + LingAo IMU 测试及RVIZ展示

热门文章

  1. http://www.raytracegroundup.com/downloads.html 对该页的翻译。
  2. 项目管理风险控制及注意事项
  3. 如何安装和使用RAutomation
  4. 同一套C#.NET程序,给同一个人卖了3次的反思
  5. 设置上传文件的最大大小
  6. 嵌入式入门要知道的五个小窍门-心得
  7. 高防御服务器与高防御IP之间的关系
  8. 如何让SD-WAN超越MPLS?
  9. flutter apk 打包
  10. 计蒜客NOIP模拟赛(2) D2T2紫色百合