vue生成二维码

     安装QRCode插件

         cnpm i QRCode --save

1. import QRCode from 'qrcode'

   useqrcode(data) {
             var canvas = document.getElementById('canvas')
             QRCode.toCanvas(canvas, data, function(error) {
               if (error) console.error(error)
               console.log('QRCode success!')
             })
           },

   如果需要下载此二维码需要使用html2canvas

2. cnpm install html2canvas --save

 

// 导出
        createPicture() {
          html2canvas(document.getElementById('canvas'), {
            backgroundColor: null
          }).then(canvas => {
            var imgData = canvas.toDataURL('image/jpeg')
            this.fileDownload(imgData)
          })
        },
        // 下载图片
        fileDownload(downloadUrl) {
          const aLink = document.createElement('a')
          aLink.style.display = 'none'
          aLink.href = downloadUrl
          aLink.download = 'qrcode.png'
          // 触发点击-然后移除
          document.body.appendChild(aLink)
          aLink.click()
          document.body.removeChild(aLink)
        }