vue项目下载excel方法(.xlsx文件)以及导出

安装 xlsx

npm i xlsx --save

1.代码中发送请求接口

import { downFileStream } from "@/libs/tools";  //引入

export default {
    methods:{
        方法(){
            请求方法名().then(res => {
                downFileStream(, "模板文件.xlsx");
            });
        }
    }
}

2.请求中

export const downFileStream = (blob, name) => {
  const url = (blob)
  const link = ('a')
   = 'none'
   = url
  ('download', name)
  (link)
  ()
  (link)
  (url)
}

导出文件

接口: 带上blob

//axios请求
export const 接口名= data =>
  ('/abt/abtComKjLibw/exportTJbySNO', data, {
    responseType: 'blob'
  })

调用接口

exportTJbySNO('参数').then(res => {
   downFileStream(, '使用统计表.xls')
})

axios封装时判断responseTypes类型

//响应拦截器
interceptors(instance,url){
    //请求
    (
      config => {
        const {
          expireTime,
          refreshTime,
          ...infos
        } = getStorage('i_f', {})
        const token = getStorage('t_k')
        const now = ()
        // 添加全局的loading...
        if (!().length) {
          // () // 不建议开启，因为界面不友好
        }
        [url] = true
         = token
        /**
         * 根据后台返回的 token 过期时间以及刷新时间来处理
         * 相关的逻辑,如果用户当前操作的时间是过期时间和
         * 刷新时间中间就自动执行刷新 token 接口,如果用户
         * 当前操作的时间已经超过了过期时间就转至登陆页面
         * 重新登陆。
         */
        if (refreshTime < now && expireTime > now && !) {
           = true
          ()
            .get('/saas/auth/refresh')
            .then(res => {
               = 
               = 
              setStorage('i_f', infos)
              setStorage('t_k', )
              ('setToken', )
              ('setInfo', infos)
               = false
            })
        } else if (expireTime < now && typeof expireTime === 'number') {
           = false
          logOut()
        }
        return (config)
      },
      error => {
        return (error)
      }
    )

    //响应
    (
      res => {
        (url)
        const {
          data,
          status,
          headers,
          config
        } = res
        // 判断导出文件的格式!!!
        const responseTypes = ['arraybuffer', 'blob', 'stream']
        if ( &&  !== 200) {
          ()
          return {
            data,
          }
        } else if (()) {
          return {
            data,
            status,
            headers
          }
        } else {
          return {
            data,
            status
          }
        }
      },
      error => {
        (url)
        let errorInfo = 
        if (!errorInfo) {
          const {
            request: {
              statusText,
              status
            },
            config
          } = ((error))
          errorInfo = {
            statusText,
            status,
            request: {
              responseURL: 
            }
          }
        }

        if ( === 500 && ) {
          /**
           * @status {Number} 后台约定的状态码
           *
           * 119 token失效或未登录需要跳转至登陆页面
           */
          switch () {
            case 119:
              logOut()
              break
          }
        }
        return (error)
      }
    )

}