vue 下载

2021-10-26  本文已影响0人  波仔_4867

下载单文件

  //直接a标签跳转下载
           <a
              :href="$api.showImageUrl + item.resourceurl"
              :download="item.resourcename"
              id="down"
              style="margin-right: 10px"
            >
              <Icon
                type="ivu-icon ivu-icon- iconfont icon-xiazai"
                style="margin-right: 5px"
              />下载
            </a>

//创建节点下载  父元素需要添加 id="down"
      //资源分类1音频2视频3图片4文档
      let url = this.$api.downLoadUrl + this.info_details.resourceurl;
      let surl = this.info_details.resourceurl;
      let filename = surl.substring(surl.lastIndexOf("/") + 1, surl.length);
      const a = document.createElement("a"); // 创建a标签
      document.getElementById("down").appendChild(a);
      a.setAttribute("download", filename); // download属性
      a.setAttribute("href", url); // href链接
      a.click(); // 自执行点击事件
      document.getElementById("down").removeChild(a);

下载多文件

 for (let i = 0; i < data.resources.length; i++) {
        const iframe = document.createElement("iframe");
        iframe.style.display = "none";
        iframe.src = this.$api.downLoadUrl + data.resources[i].resourceurl;
        document.body.appendChild(iframe);
      //这里删除节点和网络任务没关系
        setTimeout(() => {
          iframe.remove();
        }, 2 * 60 * 1000);
      }

下载应用

let url = this.$api.baseImageUrl + res.obj.versionpath;
let newFileUrl = encodeURI(url, "utf-8");
window.location.href = newFileUrl;

生成二维码

//安装插件 qrcodejs2
import QRCode from "qrcodejs2";

<div id="appQrcode" ref="appQrcode"></div>

         this.$nextTick(() => {
              let qrcodeEl = this.$refs.appQrcode;
              if (!qrcodeEl) {
                return;
              }
              qrcodeEl.innerHTML = "";
              let qrcode = new QRCode(qrcodeEl, {
                width: 300,
                height: 300,
                text: this.$api.downLoadUrl + data.obj.versionpath  //下载链接
              });
              qrcode._el.title = "";
            });
上一篇 下一篇

猜你喜欢

热点阅读