vue2下载excel表格数据

1、调用导出数据的api接口：因为返回的数据是二进制流，使用 responseType:’blob’

export function getExportTemplate() {
  return request({
    url: '/sys/user/import/template',
    responseType: 'blob' // 二进制文件流
  })
}

2、直接掉接口会直接显示报错，在这设置一下响应拦截器

if(response.data instanceof Blob) {
    rteurn response.data
}

3、安装file-saver

pnpm i file-saver 或者 npm i file-saver （可点击进入官网）

4、点击按钮调用接口，使用 file-saver 将 blob 转化成文件下载

<el-button size="mini" @click="exportEmployee">excel导出</el-button>

import FileSaver from 'file-saver'
import {
    exportEmployee
} from '@/api/employee'
export default {
    name: 'Employee',
    // ...
    methods: {
        // ...
        async exportEmployee() {
            const result = await exportEmployee()
            // FileSaver.saveAs(blob对象, 文件名称)
            FileSaver.saveAs(result, '员工信息表.xlsx')
        }
    }
}