一、安装vue-qr

npm install vue-qr --save

二、使用组件

<script setup name="chargeReport">
 import { ref } from 'vue';
import vueQr from 'vue-qr/src/packages/vue-qr.vue';
 
const codeText=ref("https://lihuanting.com");
const logoImg=ref("https://lihuanting.com/upload/1617020718890.png");
</script>

<template> 
    <div class="qr-box">
  
        <vue-qr 
            id="payQR" 
            v-if="codeText" 
            :text="codeText" 
            :size="248" 
            colorDark="#5559FF" 
            colorLight="#ffffff"
            :logoSrc="logoImg"  
            >
 
        </vue-qr>
  </div>
</template>

图片链接如果加载不成功会报错

https://blog.csdn.net/LiYinghao_/article/details/135763364