前端模拟postman功能sand and download

1.首先创建一个发送按钮

<el-button tabindex="" :disabled="hu" ref="hu" v-show="!hu" class="hu elButton additional default" @click="exportHandler">
        <i class=""></i>
        <span>二维码</span>
      </el-button>

2.创建一个点击事件,大部分代码可以复用 之后根据业务不同去修改

//二维码
      exportHandler(data){
        let self = this;
        let params = {
          id: data.id
        };
        //请求接口
        axios({
          method: get或者post,
          url:访问的接口,
          params: params,
          responseType: blob,//定义接口响应的格式,很重要
        }).then(response => {
          if (!response || !response.data) {
            self.$message({
              type: error,
              message: "导出失败！"
            });
            return;
          }

          let blob = new Blob([response.data]);//response.data为后端传的流文件
          let downloadFilename = "sasasa" + ".zip";//设置导出的文件名
          if (window.navigator && window.navigator.msSaveOrOpenBlob) {
            //兼容ie浏览器
            window.navigator.msSaveOrOpenBlob(blob, downloadFilename)
          }else {
            //谷歌,火狐等浏览器
            let url = window.URL.createObjectURL(blob);
            let downloadElement = document.createElement("a");
            downloadElement.style.display = "none";
            downloadElement.href = url;
            downloadElement.download = downloadFilename;
            document.body.appendChild(downloadElement);
            downloadElement.click();
            document.body.removeChild(downloadElement);
            window.URL.revokeObjectURL(url);
          }
          self.$message({type: "success", message: 导出成功！});

        }).catch(err => {
          self.$message({
            type: error,
            message: "导出失败！"
          });
        })
      },

3.一定要导入

import axios from axios;

以上为测试,可以根据业务的需求进行更改