【无标题】

最新推荐文章于 2024-10-10 20:59:20 发布

暮色汀州

最新推荐文章于 2024-10-10 20:59:20 发布

阅读量349

点赞数 8

文章标签：前端

本文链接：https://blog.csdn.net/weixin_44168064/article/details/135864207

版权

生成二维码并下载

<div id="qrcode"></div>

  /**
   * 下载二维码
   * @param row
   */
  handleDownload(row) {
    var qrcode = new QRCode('qrcode', {
      // 这里选择器也可以直接写 'qrcode' 用的是id选择器   指示不需要带 # 而已
      text: row.url, //  生成二维码的 内容
      width: 400, //  宽   单位 px
      height: 400, //  高   单位 px
      correctLevel: QRCode.CorrectLevel.H, // 二维码容错 级别
    });
    let myCanvas = document.getElementById('qrcode').getElementsByTagName('canvas');
    //建一个a标签节点
    let a = document.createElement("a")
    //设置a标签的href属性（将canvas变成png图片）
    a.href = myCanvas[0].toDataURL('image/png')
    //设置下载文件的名字
    a.download = row.activityname;
    //点击
    a.click()
    //下载完后移除qrcode中的文件列表
    let el = document.getElementById('qrcode');
    let childs = el.childNodes;
    for(let i = childs.length - 1 ; i >= 0; i--){
      el.removeChild(childs[i]);
    }

  }