qrcode
qrcode.js是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas绘制而成,不依赖任何库。可以快速的在web页面中绘制出二维码。
安装插件
npm install --save qrcodejs2
在需要的页面引入
import QRCode from 'qrcodejs2'
HTML布局
<template>
<div>
<div id="qrcode" ref="qrCodeDiv"></div>
</div>
</template>
this.$http.get('二维码链接地址接口').then((res) => {
if (res.data.code == 1) {
new QRCode(this.$refs.qrCodeUrl, {
text: res.data.data.url, //接口返回的二维码链接地址
width: 200, // 二维码的宽度
height: 200, // 二维码的高度
colorDark: "#000", //二维码的颜色
colorLight: "#fff", //二维码的背景色
});
} else {
this.$message.error({ message: res.data.msg });
}
});
注意:
qrcode生成二维码插件在线上运行时可能会报一个错误
我当时也是一脸懵逼,因为在本地运行没有报错但是在线上会出现这个错误,不能刷新页面,不能进入二级页面,当时在项目包里面也搜索不到这个字段,后来也是问了前端大佬才知道问题在哪
安装完qrcode插件后会在node_modules里面生成一个包,找到这个js文件
然后搜索报错的字段,改成这样的,删掉第一个this后面的_android就可以了