1.安装 qrcodejs2
npm install qrcodejs2 --save
2.在需要使用的组件内引入
<script>
import QRCode from "qrcodejs2"
export default {
components: { QRCode },
data(){
link: 'https://baidu.com'
},
}
</script>
3.指定显示二维码的DOM元素
<div id="qrcode" ></div>
4.创建生成二维码的方法
data(){
link: 'https://baidu.com'
},
methods: {
// 生成二维码
qrcode () {
let that = this;
let qrcode = new QRCode('qrcode', {
width: 124,
height: 124, // 高度
text: this.link, // 二维码内容
// render: 'canvas' , // 设置渲染方式(有两种方式 table和canvas,默认是canvas)
// background: '#f0f', // 背景色
// foreground: '#ff0' // 前景色
})
}
},
5.调用
this.qrcode();