vue 如何下载文件

import axios from 'axios'
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    config.headers.common['contentType'] = 'application/json;charset=utf-8';
    const token = localStorage.getItem('token');
    if (token) {
        config.headers.common['x-customs-user'] = token;
    }
    return config;
}, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    return response;
}, function (error) {
    return Promise.reject(error);
});
function post (url, data = {}) {
    console.log(data);
    return new Promise ((resolve, reject) => {
        axios.post(url, data,{responseType:'arraybuffer'}).then(response => {
            resolve(response.data);
        }).catch(error => {
            reject(error);
        })
    })
}
export default { post }

import http from '../axios.js'
download(fileData){
    const url = window.URL.createObjectURL(new Blob([fileData],{type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}))
    const link = document.createElement('a')
    link.href = url
    link.setAttribute('download', '下载文件名称.xls') // 下载文件的名称及文件类型后缀
    document.body.appendChild(link)
    link.click()
    document.body.removeChild(link); // 下载完成移除元素
    window.URL.revokeObjectURL(url); // 释放掉blob对象
},
// 导出
clickExport() {               
  http.post(params).then(fileData => {
       console.log(fileData) // response.data
       this.download(fileData)
  })
}

说明；

1、转载地址：

https://www.jianshu.com/p/b61c33f11674

2、相当于转成了，text文件

3、推荐：

3.1 VUE+Elementui：https://blog.csdn.net/Making_Bug/article/details/103215033  (elementui中的使用)

3.2 vue实现文件按上传和下载：https://blog.csdn.net/hani_wen/article/details/81952001 （注重思路的方式）