小记 前端生成二维码

// 用到的库qrcodejs2
npm i qrcodejs2 --save   

 
<template>
<div id="qrCode" ref="qrCodeDiv"  class="qrcode"></div>
</template>


<script>
import QRCode from 'qrcodejs2'

    mounted: function () {
        this.$nextTick(function () {
            this.bindQRCode();
        })
    },
    methods: {
        // 生成二维码
        bindQRCode: function () {
                new QRCode( this.$refs.qrCodeDiv, {
                    text: "二维码内容",
                    width: 260,
                    height: 260,
                    colorDark: "#333333", //二维码颜色
                    colorLight: "#ffffff", //二维码背景色
                    correctLevel: QRCode.CorrectLevel.L//容错率，L/M/H
                })
        //需要生成多个二维码时
            this.$refs.qrCodeDiv.forEach((item,index) => {
                new QRCode(item, {
                    text: "二维码内容",
                    width: 260,
                    height: 260,
                    colorDark: "#333333", //二维码颜色
                    colorLight: "#ffffff", //二维码背景色
                    correctLevel: QRCode.CorrectLevel.L//容错率，L/M/H
                })
            })

        }

    },
</script>