vue前端导出的通用方法

最新推荐文章于 2024-07-02 00:00:00 发布

WebKoalaBoy

最新推荐文章于 2024-07-02 00:00:00 发布

阅读量334

点赞数

分类专栏： vue 文章标签： 1024程序员节 vue

本文链接：https://blog.csdn.net/hongyu799/article/details/127498734

版权

vue 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

exportExcel(){
     const  headers = {
       'content-type': 'application/vnd.ms-excel',
       'X-Access-Token':  token, //token
     }
     Axios({
         method: "get",
         url: this.exportXlsUrl,     //接口地址
         params: this.queryParam,   // 你的传参
         headers: headers,
         responseType: "blob",    // 指定获取数据的类型为blob
       }).then(
       function (response) {
         var fileName = decodeURIComponent(response.headers["content-disposition"].split("=")[1])
         const data = response.data;
         if (!data) {
         this.$message.warning('文件下载失败')
         return
       }
       if (typeof window.navigator.msSaveBlob !== 'undefined') {
         window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName)
       } else {
         const url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
         const link = document.createElement('a')
         link.style.display = 'none'
         link.href = url
         link.setAttribute('download', fileName)
         document.body.appendChild(link)
         link.click()
         document.body.removeChild(link) // 下载完成移除元素
         window.URL.revokeObjectURL(url) // 释放掉blob对象
       }
       }
     ).catch(function (err) {
       console.log(err)
     })
   },