导出excel

qq_43327840

已于 2022-08-09 15:03:19 修改

阅读量86

点赞数

于 2022-02-28 14:15:26 首次发布

本文链接：https://blog.csdn.net/qq_43327840/article/details/123181379

版权

前端开发 Excel导出 Blob对象接口调用数据处理

关键词由CSDN通过智能技术生成

1.封装组件 exportData.js

export const exportData = ( data, name) => {
    const content = data;
    const blob = new Blob([content]); // 构造一个blob对象来处理数据
    const fileName = name + ".xls";
    if ("download" in document.createElement("a")) {
        // 支持a标签download的浏览器
        const link = document.createElement("a"); // 创建a标签
        link.download = fileName; // a标签添加属性
        link.style.display = "none";
        link.href = URL.createObjectURL(blob);
        document.body.appendChild(link);
        link.click(); // 执行下载
        URL.revokeObjectURL(link.href); // 释放url
        document.body.removeChild(link); // 释放标签
    } else {
        // 其他浏览器
        navigator.msSaveBlob(blob, fileName);
    }
}

2.引入

import { exportData } from '@/utils/exportData'

3.使用

exportData(res.data, '导出列表')

4.接口调用

export function exportGet(url, params) {
    return new Promise((resolve, reject) => {
        axios({
                method: "GET",
                url: `${baseUrl}${url}`,
                params: params,
                headers: {
                    "Content-Type": "application/x-www-form-urlencoded",
                },
                responseType: "blob",
            })
            .then((res) => {
                console.log('sssssssssssss', res);
                // if (res.status == 200) {
                //     resolve(res.data);
                // }
                resolve(res.data)

            })
            .catch((err) => {
                err.data && reject(err.data);
            });
    });
}