cnpm install --save qrcodejs2
<template>
<div>
<div id="qrcode"></div> <!-- 创建一个div,并设置id为qrcode -->
</div>
</template>
<script>
import QRCode from 'qrcodejs2' // 引入qrcode
export default {
name : 'test',
mounted () {
this.qrcode();
},
methods: {
qrcode() {
let qrcode = new QRCode('qrcode', {
width: 132,
height: 132,
text: 'https://www.baidu.com', // 二维码地址
colorDark : "#000",
colorLight : "#fff",
})
},
}
}
</script>
<style lang='less'>
#qrcode {
display: inline-block;
img {
width: 132px;
height: 132px;
background-color: #fff; //设置白色背景色
padding: 6px; // 利用padding的特性,挤出白边
}
}
</style>
网友评论