<template>
    <el-button @click="downloadUrl">導出Excel</el-button>        
</template>
<script>
import api from "../../api/api.js";
import axios from "axios";
export default {
  data() {
    return {
        pageSize:30,
    }
  },
  created() {},
  computed: {},
  mounted() {},
  methods: {
    downloadUrl() {
      // console.log(api.serverUrl);
      let params = {
        pageNum: "1",
        pageSize: this.pageSize,
        companyId: JSON.parse(sessionStorage.getItem("companyId"))
      };
      this.download_accountsDetails_info(params);
    },
    download_accountsDetails_info(params) {
      return new Promise((resolve, reject) => {
        axios
          .get(api.serverUrl + "/order/exportOrder", {
            params: params,
            responseType: "blob" // 1.首先設置responseType對象格式為 blob:
          })
          .then(
            res => {
              //resolve(res)
              let blob = new Blob([res.data], {
                type: "application/vnd.ms-excel"
              }); // 2.獲取請求返回的response對象中的blob 設置文件類型，這里以excel為例
              let url = window.URL.createObjectURL(blob); // 3.創(chuàng)建一個臨時的url指向blob對象

              // 4.創(chuàng)建url之后可以模擬對此文件對象的一系列操作，例如：預覽亏推、下載
              let a = document.createElement("a");
              a.href = url;
              a.download = "導出表格.xlsx";
              a.click();
              // 5.釋放這個臨時的對象url
              window.URL.revokeObjectURL(url);
            },
            err => {
              resolve(err.response);
            }
          )
          .catch(error => {
            reject(error);
          });
      });
    },
};
</script>
<style>
</style>

原文鏈接:https://blog.csdn.net/samarket/java/article/details/90479013