思路:
传url,传参,传导出excel名称

一、js原生写法具体实现代码

function exportExcel(data) {
	var html = '<div class="pendingBox">下载中,请稍后<img src="../../src/img/loading.png"/></div>'
	$('body').append(html)
	axios({
		method: 'post',
		url: urlIP + data.url,
		responseType: 'blob',
		headers: {
			'Authorization': getCookie('Authorization')
		},
		data: data.data
	}).then(res => {
		$('.pendingBox').remove()
		const BLOB = res.data;
		const fileReader = new FileReader();
		fileReader.readAsDataURL(BLOB);
		fileReader.onload = (e) => {
			let a = document.createElement('a');
			a.download = data.name + '.xlsx'
			a.href = e.target.result;
			document.body.appendChild(a)
			a.click();
			document.body.removeChild(a)
		}
	}).catch(err => {
		console.log(err.message)
	})
}

二、vue中写法具体实现代码

import axios from "axios";
/*
    data: {
        url: ''  // 请求路径
        data: {} // 请求参数
        name: '' // 文件名
    }
*/
export default function(data) {
  axios({
    method: "post",
    url: data.url,
    responseType: "blob",
    data: data.data
  })
    .then(res => {
      const BLOB = res.data;
      const fileReader = new FileReader();
      fileReader.readAsDataURL(BLOB);
      fileReader.onload = e => {
        let a = document.createElement("a");
        a.download = data.name + ".xlsx";
        a.href = e.target.result;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
      };
    })
    .catch(err => {
      console.log(err.message);
    });
}

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐