qrcode 生成二维码（jQuery、vue）

最新推荐文章于 2024-04-26 16:47:03 发布

无法长大

最新推荐文章于 2024-04-26 16:47:03 发布

阅读量1.3k

点赞数 1

文章标签： jquery javascript 前端 vue.js

本文链接：https://blog.csdn.net/m0_38082271/article/details/126707820

版权

一.Jquery qrcode 生成二维码

资源下载：jquery.qrcode.min.js

// 使用方式如下
<div id="qrcode"></div>

// canvas方式
$('#qryscode').qrcode({
    render: "canvas",
    text: "https://www.baidu.com/",
    width: "150",               // 二维码的宽度
    height: "150",              // 二维码的高度
    background: "#ffffff",      // 二维码的后景色
    foreground: "#000000"       // 二维码的前景色
});

// table方式
$('#qryscode').qrcode({
    render: "table",
    text: "https://www.baidu.com/",
    width: "150",               // 二维码的宽度
    height: "150",              // 二维码的高度
    background: "#ffffff",      // 二维码的后景色
    foreground: "#000000"       // 二维码的前景色
});

二、vue中使用qrcode 生成二维码

npm install --save qrcode

// 在vue页面
import VueQrcode from 'vue-qrcode';

<vue-qrcode  :width="200" :value="qrcodeText"/>

qrcodeText: 'https://www.baidu.com/'