JavaScript

超轻量级php框架startmvc

vue下载excel的实现代码后台用post方法

更新时间:2020-08-25 22:48 作者:startmvc
后台方法的参数必须是@RequestBody修饰的。     前台关键代码:   

后台方法的参数必须是@RequestBody修饰的。

      前台关键代码:   


axios ( {
 method : 'post',
 url : api.exportPlayTime , // 请求地址
 data : {
 choose : type,
 begindate : startDate,
 enddate : endDate
 },
 responseType : 'arraybuffer',
 observe: 'response',
 } )
 .then ( ( res ) => {

 const fileName = ""+filename+".xlsx"
 let blob = new Blob([res.data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
 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 )
 }
 })

download(data) {
 if (!data) {
 return
 }
 let url = window.URL.createObjectURL(new Blob([data]))
 let link = document.createElement('a')
 link.style.display = 'none'
 link.href = url
 link.setAttribute('download', 'excel.xlsx')

 document.body.appendChild(link)
 link.click()
 },

总结

以上所述是小编给大家介绍的vue下载excel的实现代码后台用post方法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!