vue3生成二维码

vue3 qr-code

字数统计: 171阅读时长: 1 min

 2024/01/01 

简介

需要在项目中自动生成和展示QR码，在github上翻到了名为qrcode.vue的开源项目，这是一款 Vue.js 二维码组件，同时支持 Vue 2 和 Vue 3。

快速开始

快速添加 qrcode.vue 组件到项目中:

1
2
3

npm install --save qrcode.vue
// or
yarn add qrcode.vue

使用

在单个 *.vue 文件中当组件使用:

<script setup>
import { reactive } from 'vue'
import QrcodeVue from 'qrcode.vue'

const data = reactive({
  payUrl: 'sakishum.com',
  size: 256
})

</script>

<template>
  <div>二维码生成</div>
  <qrcode-vue :value="data.payUrl" :size="data.size" level="H" />
</template>

<style scoped>
</style>