vue前端实现base64转excel格式文件并下载

base64ToFile的js文件 

const util = {
  // 创建一个a标签，并做下载点击事件
  downloadFile: function(blob, fileName) {
    const link = document.createElement('a')
    link.href = window.URL.createObjectURL(blob)
    link.download = fileName
    // 此写法兼容可火狐浏览器
    document.body.appendChild(link)
    const evt = document.createEvent('MouseEvents')
    evt.initEvent('click', false, false)
    link.dispatchEvent(evt)
    document.body.removeChild(link)
  },
  // 将Base64文件转为 Blob
  buildBlobByByte: function(data) {
    const raw = window.atob(data)
    const rawLength = raw.length
    const uInt8Array = new Uint8Array(rawLength)
    for (let i = 0; i < rawLength; ++i) {
      uInt8Array[i] = raw.charCodeAt(i)
    }
    return new Blob([uInt8Array])
  },
  // 二进制数组 生成文件
  downloadFileByByte: function(data, fileName) {
    const blob = this.buildBlobByByte(data)
    this.downloadFile(blob, fileName)
  }

vue文件 

  <el-link
          :underline="false"
          class="el-icon-view el-icon--right"
          @click="downloadView"
          style="color:red"
          >下载查看：错误信息汇总表</el-link
  >

第一种：（推荐） 

<script>
// 这里引入封装好的base64转excel的js文件
 import util from '@/utils/base64ToFile'
export default {
     data() {     
        return {           
           errurl: ''
        } 
     },
     methods:{    
         //  推荐这种方法
          downloadView() {
              // this.errurl是后台返回的路径
              util.downloadFileByByte(this.errurl, '错误信息汇总表.xlsx')   
           }
     }    
}
 
</script>

第2种：（不推荐）这种写法不兼容office的低版本，下载之后查看报错，不建议使用这种写法  

<script>
// 这里引入封装好的base64转excel的js文件
 import util from '@/utils/base64ToFile'
export default {
     data() {     
        return {           
           errurl: ''
        } 
     },
     methods:{    
         //  这种写法不兼容office的低版本，下载之后查看报错，不建议使用这种写法
          downloadView() {
              var raw = window.atob(this.errurl);
              var uInt8Array = new Uint8Array(this.errurl.length);
              for (var i = 0; i < raw.length; i++) {
                    uInt8Array[i] = raw.charCodeAt(i);
              }
              const link = document.createElement('a');
              const blob = new Blob([uInt8Array], {
                   type: 'application/vnd.ms-excel'
              });
              link.style.display = 'none';
              link.href = URL.createObjectURL(blob);
              link.setAttribute('download', '错误信息汇总表' + '.xlsx');
              document.body.appendChild(link);
              link.click();
              document.body.removeChild(link);
              util.downloadFileByByte(this.errurl, '错误信息汇总表.xlsx')
          }
      }   
}
 
</script>