2021-01-27 在VUE中导出xls文件乱码的问题

在VUE中导出xls文件乱码的问题

（纯个人使用中记录，可能有很多不清楚的）

1、后台接口：这就不说了，毕竟这个接口也不是我开发的

2、前台接口的js文件，重点就是最后面的config参数：{ responseType: 'arraybuffer' }，我的问题就出在这个上面，一开始没有加就导致乱码

  // 导出有效数据
exportValid (params) {
  return Vue.axios.post('...url...', params, { responseType: 'arraybuffer' })
},

3、具体的接口调用，使用blob，倒是一般的使用方式

const that = this
TestDataApi.importValidTemplate().then((result) => {
  const blob = new Blob([result], { type: 'application/vnd.ms-excel;charset=UTF-8' })
  window.console.log(blob)
  const downloadElement = document.createElement('a')
  const href = window.URL.createObjectURL(blob)
  window.console.log(href)
  downloadElement.href = href
  downloadElement.download = 'ColumnImportTemplate.xls'
  document.body.appendChild(downloadElement)
  window.console.log(downloadElement)
  downloadElement.click()
  document.body.removeChild(downloadElement)
  window.URL.revokeObjectURL(href)
}, (err) => {
  that.handleError(err)
})
  .catch((error) => {
    that.$message.error(error.toString())
  })