zoukankan      html  css  js  c++  java
  • vue 用axios实现调用接口下载excel

    了解的方式有两种:

    1. 用a标签,href设置为后端提供的excel接口

    <a href="excel接口">导出</a>

    简单方便,缺点就是当有token校验时,不适合

    2. 用axios

    把token放在请求的header里边

    import axios from 'axios'
    import { getToken } from 'js-cookie';
    
    methods: {
        exportExcel () {
            let url = 'http...',
                token = getToken();
            axios.get(url, {
                headers:{
                    "Admin_token":token
                },
                responseType: 'blob', //二进制流
            }).then(function (res) {
                if(!res) return
                let blob = new Blob([res.data], {type: 'application/vnd.ms-excel;charset=utf-8'})
                let url = window.URL.createObjectURL(blob);
                let aLink = document.createElement("a");
                aLink.style.display = "none";
                aLink.href = url;
                aLink.setAttribute("download", "excel.xls");
                document.body.appendChild(aLink);
                aLink.click();
                document.body.removeChild(aLink); 
                window.URL.revokeObjectURL(url); 
            }).catch(function (error) {
                console.log(error)
            });
        }
    }

    注:如果上面的方法还是乱码,请尝试一下方法:

     1.如果装了mockjs,把mockjs去掉

     2.使用原生的js请求

    参考:https://blog.csdn.net/xuesheng1610748/article/details/83865679

  • 相关阅读:
    访问虚拟机
    w3school JavaScript 简介
    蘑菇街2016研发工程师在线编程题
    乐视2017暑期实习生笔试题(二)
    今日头条2017后端工程师实习生笔试题
    c# 读取 excel文件内容,写入txt文档
    处理字符串
    XML获取节点信息值
    SVN仓库目录结构
    sql 知识点
  • 原文地址:https://www.cnblogs.com/bear-blogs/p/10480478.html
Copyright © 2011-2022 走看看