Vue结合后台导入导出Excel问题详解

2019-08-14 10:27:53来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

话不多说,直接上前端代码

axios({
  method: 'post',
  url: 'http://localhost:19090/exportUser',//这个是请求的地址
  params: {//这个是请求的参数
   email: this.email,
   startRegisterDate: this.registerStartTime,
   endRegisterDate: this.registerEndTime
  },
  responseType: 'blob'
  }).then((res) => {
  console.log(res)
  const link = document.createElement('a')
  let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});
  link.style.display = 'none'
  link.href = URL.createObjectURL(blob);
  let num = ''
  for(let i=0;i < 10;i++){
   num += Math.ceil(Math.random() * 10)
  }
  link.setAttribute('download', '用户_' + num + '.xls')
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
  }).catch(error => {
 
  console.log(error)
  })

仔细看axios请求加了个responseType: 'blob'配置,这是很重要的

我的项目因为请求头里面需要加sessionId,所以需要用上面方法

 

如果是get请求,请求头不需要额外加参数,直接 window.location.href='http://localhost:19090/exportUser?email='+email+"&start="+start ,打开一个地址即可

'

 


原文链接:https://www.cnblogs.com/ttjm/p/11307462.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:vue-cli3构建ts项目

下一篇:js 数据类型的判断