vue做一个导出excel功能，可导出的身份证号带E？

Question

页面如下：

导出是用xlsx插件实现的，可导出后的excel显示的数据格式不对

代码：

//导出当前表格
exportCurrent:function(){
    var wb = XLSX.utils.table_to_book(document.querySelector('#out-table')) //表格id
    var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
    try {
        FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheet.xlsx')  //文件名
    } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
    return wbout
},

这个该怎么解决呀 找相关文档也找不到 好心酸~~

Answer 1

给身份证那一个td 添加 style,例如 mso-number-format:'\@';.

<td style="mso-number-format:'\@';">100821199909091234</td>

js导出excel表格中较长数字串会变成科学计数法问题

Answer 2

之前也遇到了这样的问题 用以下方式解决了
let xlsxParam = { raw: true };//转换成excel时，使用原始的格式
/ generate workbook object from table /
let wb = XLSX.utils.table_to_book(document.querySelector('#out-table'),xlsxParam);

Answer 3

因为那列导出的 excel 单元格类型是数字，大的数字就会自动采用科学计数法。
你看看有没有相应配置，修改一下单元格类型。

Answer 4

使用这个 试一下：https://www.jianshu.com/p/82a...

Answer 5

最近也弄了一个导出excel文件的功能，用的原生js实现，也发现这问题。试过把输出的数据改为字符串类型是无效的。
这类型功能一般是将表格中的数据提取插入另一个table标签的字符串模板中，在导出内容转为Blob之前本身就是以字符串的形式存在。
表格的显示类型都是excel文件默认的单元格格式类型导致，如果没法做到修改excel单元格格式类型，那这问题是无解的。通过修改td的style为mso-number-format:'@'可以解决该问题，受楼上@rolitter启发
下面是尝试的demo

//关键代码如下
function exportFile(exportObj){
  // 创建可下载链接
  let eleLink = document.createElement('a');
  eleLink.download = exportObj.fileName || '';
  eleLink.style.display = 'none';
  eleLink.target = "blank";
  if(!exportObj.href){
    // 字符内容转变成blob地址
    let blob = new Blob([exportObj.data],exportObj.opt);
    exportObj.href = URL.createObjectURL(blob);
  }
  eleLink.href = exportObj.href;
  eleLink.click(); // 触发点击
}


function outputTableHtml(table){
  let html = `
    <table border="1">
      <thead>
        <tr>
          ${table.tableHead.map(item=>`<th>${item.label||item.name}</th>`).join('')}
        </tr>
      </thead>
      <tbody>
        ${table.tableData.map(r=>`<tr>${table.tableHead.map(c=>`<td style="mso-number-format:'\@'">${r[c.name]==undefined ? "" : r[c.name]}</td>`).join('')}</tr>`).join('')}
      </tbody>
    </table>
  `;
  return html;
}

// table = {
//   tableHead: [{
//     name: 'test',
//     label: '表头的标签'
//   }],
//   tableData: [{
//     test: '表格单元格的值'
//   }]
// }
exportFile({
  data: outputTableHtml(table),
  fileName: '测试导出.xls',
  opt: { type: "application/vnd.ms-excel" }
})

Answer 6

我之前也有遇到过 但是不是用的vue 提供一下思路看看可以解决不，这个是因为他是数字导致的 把你要导出的数据里面卡号那一列和身份证那一列的数据都改成字符串。

Answer 7

学下微信支付，在前面加个 ` 符号。
这个符号在Tab键上方