vue3.2使用QrCode生成二维码

一、安装

npm install qrcode.vue --save

二、引入

import QrcodeVue from 'qrcode.vue'

三、使用

 <qrcode-vue :value="codeUrl" :size="size" level="H" />

参数说明:

  1. value:二维码链接
  2. size:二维码大小
  3. level:二维码容错率 "L" | "M" | "Q" | "H"

四、完整代码

<template>
 <qrcode-vue :value="codeUrl" :size="size" level="H" />
</template>

<script lang="ts" setup>
import QrcodeVue from 'qrcode.vue'
import {ref} from 'vue'

const codeUrl = ref('https://www.baidu.com')
const size = ref<number>(180);
</script>