• axios 如何获取下载文件的进度条


    exportFun(){
            let _that = this
            const instance = this.axios.create({
              onDownloadProgress: function(ProgressEvent) {
                const load = ProgressEvent.loaded;
                const total = ProgressEvent.total;
                const progress = (load / total) * 100;
                console.log(progress);
                bar.style.width=(progress) + "%";
                $("#total").html( Math.floor(progress) + "%")
                if(progress == 100){
                  _that.$emit('exportDataFun',this.needData)
                  _that.isDownLoad = false
                }
              } 
            });
            let ajaxUrl,fileName
            if(this.isCanClick){
              let _that =this
              _that.isCanClick = false
              instance({
                url: ajaxUrl,
                method: "post",
                data: this.needData,
                responseType: "blob" //application/octet-stream
              }).then(res => {
                const data = res.data
                  let r = new FileReader()
                  r.onload = function () {
                    try {
                      let resData = JSON.parse(this.result)
                      console.log(resData)
                      if (resData && resData['code'] && resData['code'] != '1000') {
                        _that.$Message.info(resData.msg);
                        _that.isDownLoad = false
                      }
                    } catch (err) {
                      // 兼容ie11
                      if (window.navigator.msSaveOrOpenBlob) {
                        try {
                          const blobObject = new Blob([data])
                          window.navigator.msSaveOrOpenBlob(blobObject, fileName)
                        } catch (e) {
                          console.log(e)
                        }
                        return
                      }
                      this.download(data, fileName)
                      alert('导出成功')
                    }
                  }
                  r.readAsText(data) // FileReader的API
              }).catch(e => {
                let msg = "网络异常";
                alert(msg);
              });
  • 相关阅读:
    kafka常见问题汇总
    kafka可视化工具kafkatool
    VB.NET DevExpress GirdView 搜素框界面Find Clear按钮转换为自定义中文
    winform DevExpress GridView复制单元格方法
    DevExPress GridView获取单元格坐标和内容
    Winform Log4Net使用(一)(产生yyyyMMdd'.log)便于每天使用记录一眼能看出哪天使用时出错
    winform 判断重复检测,是否开启相同应用程序 和 线程异常捕获
    winfrom Run状态控件刷新办法
    C# winform Panel自定义移动窗口
    C# 控制台CMD辅助类
  • 原文地址:https://www.cnblogs.com/jiajiamiao/p/11607791.html
Copyright © 2020-2023  润新知