Package Exports

vue-qrcode-component-v3
vue-qrcode-component-v3/src/QRCode.vue

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-qrcode-component-v3) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

vue-qrcode-component-v3

Create QR codes with a simple Vue component, forked from gerardreches/vue-qrcode-component and updated for Vue 3 and Vite.

Demo and Documentation on GitHub Pages

Installation

Install the package:

npm install vue-qrcode-component-v3

Then register the component:

import { createApp } from 'vue'
import VueQRCodeComponent from 'vue-qrcode-component-v3'

const app = createApp(App)
app.component('qr-code', VueQRCodeComponent)

Now you can use it as:

<qr-code text="Text to encode"></qr-code>

Usage

Props

prop	type	required	default	validation
text	String	true
size	Number	false	256
color	String	false	'#000'
bg-color	String	false	'#FFF'
error-level	String	false	'H'	Only accepts 'L', 'M', 'Q' or 'H'.

Note: size prop uses pixels units.

Example

We will generate a QR code that gives an URL on decode. It measures 500x500 px, uses a yellow color for the code and a blue color for the background. This QR will use a Low error correction level.

<qr-code
    text="https://goo.gl/9eIWP9"
    size="500"
    color="#f1c40f"
    bg-color="#3498db"
    error-level="L">
</qr-code>