法一：
1.全局引入jQuery/qrcode
npm install jquery
npm install qrcode-npm
2.页面引入jQuery/qrcode
import $ from "jquery";
var QRCode = require('qrcode')
4.页面代码
<input id="text" type="text" value="http://www.runoob.com" style="width:80%" /><br /><div id="qrcode" style="width:100px; height:100px; margin-top:15px;"></div>
3.挂载时写入
mounted(){
QRCode.toDataURL('https://www.baidu.com').then(url => {
var qrbox = document.querySelector("#qrcode");
const img = new Image();
img.src=url;
qrbox.appendChild(img);
})
.catch(err => {
console.error(err)
})
},
法二：
步骤：
1、安装qrcodejs2插件，在控制台输入：
npm install qrcodejs2 --save
*注意：这里安装的是qrcodejs2，不是qrcode，否则会报错
2、页面引入——在入口文件（默认是main.js）里引入：
import QRCode from 'qrcodejs2'
3、页面展示
①：在对应的Html页面中，添加html标签
<div id="qrcode" ref="qrcode"></div>
②：配置，在methods方法里配置：
qrcode () {
let qrcode = new QRCode('qrcode',{
width: 200, // 设置宽度，单位像素
height: 200, // 设置高度，单位像素
text: 'https://www.baidu.com' // 设置二维码内容或跳转地址
})
}
③：调用
this.$nextTick(() => {
this.qrcode()
})
转载于:https://www.cnblogs.com/miaSlady/p/9071735.html