0
点赞
收藏
分享

微信扫一扫

vue3 excel 文件导出

编程练习生J 2024-05-28 阅读 19

//文件导出  在index.ts 中

export function downloadHandle(url: string,params?:object, filename?: string, method: string = 'GET'){

    try {

        downloadLoadingInstance = ElLoading.service({

            text: "正在生成下载数据,请稍候",

            background: "rgba(0, 0, 0, 0.7)",

        });

        return service.get(url, {

            responseType: 'blob',

            params:params?params:''

        }).then(async (resp: any) => {

            // 创建a标签

            const down = document.createElement('a')

            // 文件名没传,则使用时间戳

            if (filename) {

                down.download = filename

            } else {

                const downName = resp.headers['content-disposition'].split('=')[1]

                down.download = decodeURI(downName)

            }

            // 隐藏a标签

            down.style.display = 'none'

            // 创建下载url

            down.href = URL.createObjectURL(

                new Blob([resp.data], {

                    type: resp.data.type

                })

            )

            // 模拟点击下载

            document.body.appendChild(down)

            down.click()

            // 释放URL

            URL.revokeObjectURL(down.href)

            // 下载完成移除

            document.body.removeChild(down)

            downloadLoadingInstance.close();

        }).catch((r: any) => {

            console.error(r);

            ElMessage.error('下载文件出现错误,请联系管理员!');

            downloadLoadingInstance.close();

        });

    } catch (err: any) {

        ElMessage.error(err.message)

    }

}

在页面中 引入

import {downloadHandle} from "../../api/index";

const downloadFun = () => {

    downloadHandle("/bg/customer/accountQuantity/exportExcelTemplate");

};

举报

相关推荐

0 条评论