vue 文件导出功能接口对接代码

最新推荐文章于 2023-12-22 17:00:53 发布

UpSeven0

最新推荐文章于 2023-12-22 17:00:53 发布

阅读量120

点赞数

分类专栏： javascript 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qq_34811855/article/details/129726152

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

// 接口配置
// 道路导出 api.js
import request from '@/utils/request'

export function exportRoadList(data) {
  return request({
    url: '/road/exportRoadList',
    method: 'get',
    params: data,
    responseType: 'blob'
  })
}
// js
// 导出
    exportExcel() {
      let _this = this;
      const params = {
        roadName: this.roadName,
        province: this.province,
        city: this.city
      }
      exportRoadList(params).then(response => {
        if (!response) {
          _this.$message({ type: 'error', message: '导出失败，请稍后再试!' });
          return;
        }
        // 更新导出
        let url = null;
        const link = document.createElement('a');
        link.style.display = 'none';
        url = window.URL.createObjectURL(
          new Blob([response], { type: 'application/vnd.ms-excel' }),
        );
        link.href = url;
        link.setAttribute('download', `道路.xls`);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link)
        window.URL.revokeObjectURL(url)
        _this.$message({ type: 'success', message: '导出成功!' });
      });
    },