通常的文件导出都是后端进行导出,最近一个项目遇到导出接口挂掉了,前端实现导出的状况。前端
背景是vue框架,iView组件。能够直接使用exportCsv方法进行导出。vue
导出时进行一下行和列的切割就能够了。后端
成功导出后,打开发现身份证号、手机号等超过10位的被默认科学计数法了。虽然数据是字符串,可是导出的时候仍是被默认当成了数值。因而就被使用了科学计数法。表格点击一下就会自动变成数字的,可是对于咱们开发人员来讲,能作的更好固然仍是要作到最好。框架
解决方法:在数据筛选的时候手动处理一下。直接上代码this
export2Excel() { if (this.selectedUserId.length < 1) { this.$Message.error("请选择要导出的行"); return false; } this.$refs.selection.exportCsv({ filename: '导出文件', columns: this.columns.filter((col, index) => index < 11 && index > 0), data: this.transCharactor(this.dataTable.filter((data, index) => this.selectedUserId.indexOf(data.userId) > -1)) }); }, transCharactor(dataList) { $.each(dataList, function(index, e) { for (var v in e) { e[v] = "\t" + e[v].toString() } }) return dataList }
因为这里的数据都是字符串,全部我直接就使用了toString。spa
方法原则就是转换成字符,并且拼接上别的字符使其不会被当成数字处理。(e[v] = "\t" + e[v].toString())code
除此以外,网上还有拼接单引号的方法,可是这个方法会致使看起来不舒服,试想每一个单元格都多了一个单引号,老是很差的。blog