el-table导出excel,某项数据前面的0丢失

454 阅读1分钟

问题描述:

el-table进行导出excel时,列表中某字段为字符串类型 例如其数据值为001开头的,在列表上呈现无误,但导出excel后,001就变为了1,导致00丢失了

页面列表:

image.png

导出excel:

image.png

解决方法:

1.直接在el-table对应上值前方加上 代码即可。

    <el-table-column prop="userCode" label="用户代码" width="70" fixed="left" show-overflow-tooltip>
      <template slot-scope="scope">
        <span>&nbsp;{{ scope.row.userCode }}</span>
      </template>
    </el-table-column>

2.使用XLSX.utils.table_to_book方法时,后跟一个对象参数,{raw: true},其作用为转换成excel时,使用最原始的格式,如果为真,每个单元格数据都将保存为原始字符串

exportExcel(){
    const xlsxParam = { raw: true } // 转换成excel时,使用最原始的格式
    var XLSX = require('xlsx')
    const wb = XLSX.utils.table_to_book(document.querySelector('#elTable'), xlsxParam) // 从表生成工作簿对象  table1为需要导出的表格的id
    const wbout = XLSX.write(wb, {
      bookType: 'xlsx',
      bookSST: true,
      type: 'array'
    }) // 获取二进制字符串作为输出
    console.log(wbout)
    try {
      FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '信息.xlsx') // '信息.xlsx'为导出文件的名字
    } catch (e) {
      if (typeof console !== 'undefined') console.log(e, wbout)
    }
    return wbout
}
大功告成!

image.png

除此之外还尝试了一种方式,但是尝试之后发现这种方式并不可行,不能达到我想要的效果,这个方法就是el-table的formatter属性来格式化内容:

optionStrTransfer(value, row, index) {
    return '&nbsp;' + String(value.userCode) + '&nbsp;'
}

不过这种方式并不能解决0丢失的问题😂...