Vue中前端实现导出excel文件功能,后端返回文档流

 <div class="whole_head_button" @click="download">
    <svg class="icon" aria-hidden="true">
       <use xlink:href="#icon-download-1-copy" />
     </svg>
        导出
  </div>

    //导出
      download() {
        var query = {
          page: this.currentPage,
          count: this.pagesize,
          admin_order_num: this.admin_order_num,
          year: this.year,
          month: this.month,
          type: 'excel',
        };
        axios.defaults.baseURL = this.$store.state.baseUrls
        this.axios({
          method: 'get',
          url: this.baseUrls + '/api/pcadmin/report/cost/order?' + this.encode(query),
          responseType: 'blob',
        }).then(response => {
          const content = response.data
          const blob = new Blob([content])
          const fileName = '发票差异.xlsx'
          if ('download' in document.createElement('a')) { // 非IE下载
            const elink = document.createElement('a')
            elink.download = fileName
            elink.style.display = 'none'
            elink.href = URL.createObjectURL(blob)
            document.body.appendChild(elink)
            elink.click()
            URL.revokeObjectURL(elink.href) // 释放URL 对象
            document.body.removeChild(elink)
          } else { // IE10+下载
            navigator.msSaveBlob(blob, fileName)
          }
          // eslint-disable-next-line handle-callback-err
        }).catch(error => {})
      },