vue3项目，在弹窗中使用qrcodejs2生成二维码

安装依赖

（QRCode.js是一个javaScript库，主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库）

npm i qrcodejs2 --save

实现过程

在使用的地方引入

import QRCode from 'qrcodejs2'

具体代码示例
<template>
    <div>
        <el-button @click=showQRCode>点击</el-button>
        <el-dialog title="课程二维码" :visible.sync="state.dialogVisible" width="190px" :before-close="handleClose">
          <div ref="qrCodeUrl"></div>
        </el-dialog>
    </div>
<template>
​
<script setup>
    import {reactive, getCurrentInstance, nextTick } from 'vue'
    import QRCode from 'qrcodejs2'
    
    const { proxy } = getCurrentInstance()
    const state = reactive({
        dialogVisible: false，
        qrcode： null
    })
    const showQRCode = () => {
        state.dialogVisible = true
        creatQrCode（）// 打开弹窗时生成二维码
    }
    const handleClose = () => {
        state.dialogVisible = true
        proxy.$refs.qrCodeUrl.innerHTML = '' // 关闭弹窗清除上一次的二维码
    }
    const creatQrCode = () => {
      nextTick(() => { 
      // new QRCode创建一个实例，第一个参数是承载二维码的元素，第二个参数是二维码配置信息
        state.qrcode = new QRCode(proxy.$refs.qrCodeUrl, {
          text: 'https://www.baidu.com/', // 二维码承载信息
          width: 150,
          height: 150,
          colorDark: '#000000',
          colorLight: '#ffffff', 
          correctLevel: QRCode.CorrectLevel.H  // 容错级别
        })
      })
    }
</script>
github地址： https://github.com/davidshimjs/qrcodejs