美文网首页
vue+axios Excel文件导出

vue+axios Excel文件导出

作者: Yin先生 | 来源:发表于2019-12-13 17:07 被阅读0次

html:

<button @click="handleExport">批量导出</button>

js:

// 批量导出
    handleExport() {
      axios({
        method: 'get',
        url: localStorage.imgBase_url + '/parts/barebone/download?machineType=' + this.optionsBrareboneLeftValue + '&machineModel=' + this.optionsBrareboneRightValue,
        responseType: 'blob',
        headers: {
          'Authorization': localStorage.token
        }
      }).then(res => {
        const blob = new Blob([res.data])          // 将返回二进制数据  创建Blob文件
        const fileName = `discount-code-${Date.parse(new Date())}.xls`  // 导出文件名 + 时间毫秒值 避免名称重复
        if ('download' in document.createElement('a')) {
          const elink = document.createElement('a') // 创建 a标签
          elink.download = fileName  //  创建文件名
          elink.style.display ='none'  //   导出文件样式
          elink.href = URL.createObjectURL(blob) // 创建a 标签 href
          document.body.appendChild(elink)
          elink.click()
          URL.revokeObjectURL(elink.href)
          document.body.removeChild(elink)  // 释放流文件
        }
      })
    },

相关文章

网友评论

      本文标题:vue+axios Excel文件导出

      本文链接:https://www.haomeiwen.com/subject/ruzfnctx.html