zoukankan      html  css  js  c++  java
  • 弹窗-二维码生成与下载

    div(class='zzc' v-show="showCopyPassword")
      div(class='dia_qrcode' @click="handleClose")
      div(class='dia_qrcode_div')
        el-button(class='dia_qrcode_btn', @click="downLoad") 下载二维码
        div(id="qrcode")
     
    import QRCode from 'qrcodejs2'
     
     
    showCopyPassword: false,
     
     
     
    async copyPassword(row,val) {
     
      this.showCopyPassword = true;
      this.qrcode = new QRCode('qrcode', {
      text: actionButtonUrl + row.activityId,
        150,
        height: 150,
        colorDark: '#000', // 二维码颜色
        colorLight: "#ffffff" // 背景颜色
      });
    },
    handleClose() {
      document.getElementById('qrcode').innerHTML = "";
      this.showCopyPassword = false;
    },
    downLoad() {
      const myCanvas = document.getElementById('qrcode').getElementsByTagName('canvas');
      if(myCanvas && myCanvas.length) {
        console.log(myCanvas);
        const a = document.createElement('a')
        a.href = myCanvas[0].toDataURL('image/png');
        a.download = '二维码';
        a.click()
        this.$message({
          message: "正在进行下载保存",
          type: 'success'
        })
      }else {
        this.$message.error('下载失败!')
      }
    },
     
     
  • 相关阅读:
    2.2 Scala基础知识
    Linux---用户及权限管理类命令
    Linux---进程控制类命令
    Linux---vim编辑文本文件
    Linux---文件压缩与解压缩命令
    Linux---查找命令
    Linux---基本目录与文件命令
    nginx配置技巧汇总
    Go 内嵌静态资源
    go语言的time.Sleep
  • 原文地址:https://www.cnblogs.com/J-Luck/p/14042737.html
Copyright © 2011-2022 走看看