vue 使用QRCode生成二维码

?使用vue 插件生成二维码，不多说，直接复制即可，例子：

在线图片压缩、处理、生成二维码

1、安装qrcode

yarn add qrcode;//安装


import QRCode from "qrcode"; //引入生成二维码插件
export default {
  components: {
    QRCode,
  },
}

?2、使用

直接复制即可，会生成图片并直接下载

getQRcode(urlLink) {
? ? ? let opts = {
? ? ? ? errorCorrectionLevel: "L", //容错级别
? ? ? ? type: "image/png", //生成的二维码类型
? ? ? ? quality: 0.3, //二维码质量
? ? ? ? margin: 4, //二维码留白边距
? ? ? ? width: 256, //宽
? ? ? ? height: 256, //高
? ? ? ? text: "", //二维码内容
? ? ? ? color: {
? ? ? ? ? dark: "#666666", //前景色
? ? ? ? ? light: "#fff", //背景色
? ? ? ? },
? ? ? };
      let imgurl ="";
? ? ? QRCode.toDataURL(urlLink, opts, (err, url) => {
? ? ? ? if (err) throw err;
? ? ? ? //将生成的二维码路径复制给data的QRImgUrl
? ? ? ? imgurl = url;
? ? ? });
? ? ? const downloadElement = document.createElement("a");
? ? ? downloadElement.href =  imgurl;
? ? ? downloadElement.download = "122.png";
? ? ? document.body.appendChild(downloadElement);
? ? ? downloadElement.click();
? ? ? document.body.removeChild(downloadElement);
? ? },