巧妙解决微信里进行下载功能

微信不支持download下载功能，下载功能如果需要的话可以调用的是wx自己的api，但需要chooseId ，chooseId 的获取是要使用上传接口获得。 所以可以采用通用的方案，长按保存，隐藏一个透明度为0的 img 区域置在最顶部（本文代码引用vue-qriously 用于生成项目所需的二维码，html2canvas，通过将生成的二维码部分的html转成图片路径。） 因为透明度为0的图片在最上面，所以长按会触发微信的保存图片功能。

<img class="qr_code-image" :src="imageUrl" v-if="imageUrl" />

import html2canvas from "html2canvas"; // html  -> canvas
import VueQriously from "vue-qriously"; // 生成二维码

html2canvas(this.$refs["qr_code-contain"], {
    useCORS: true,
    scale: 2,
    dpi: window.devicePixelRatio * 2,
  }).then((canvas) => {
    console.time("start:1");
    let data = canvas.toDataURL("image/jpeg", 1);
    if (this.isWX) {
      this.imageUrl = data;
    } else {
      // 用于兼容程序在h5环境的下载
      let a = document.createElement("a");
      a.download = "检查二维码";
      a.href = data;
      a.click();
    }
    console.timeEnd("start:1");
  });

结束语：关注我，少走弯路!