前端导出表格出现科学计数法解决。

一般的文件导出都是后端进行导出，最近一个项目遇到导出接口挂掉了，前端实现导出的情况。

背景是vue框架，iView组件。可以直接使用exportCsv方法进行导出。

导出时进行一下行和列的切割就可以了。

成功导出后，打开发现身份证号、手机号等超过10位的被默认科学计数法了。虽然数据是字符串，但是导出的时候还是被默认当成了数值。于是就被使用了科学计数法。表格点击一下就会自动变成数字的，但是对于我们开发人员来说，能做的更好当然还是要做到最好。

解决方法：在数据筛选的时候手动处理一下。直接上代码

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。

方法原则就是转换成字符，而且拼接上别的字符使其不会被当成数字处理。（e[v] = “\t” + e[v].toString()）

除此之外，网上还有拼接单引号的方法，但是这个方法会导致看起来不舒服，试想每个单元格都多了一个单引号，总是不好的。

版权声明：本文为ljwsyt原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/ljwsyt/p/9965048.html