ezqr-vue

Vue 3 component that embeds the EZQR free QR code generator on your site.

Try it live

The same embed this component renders, running on a few popular code-sandbox sites:

• CodePen demo
• JSFiddle demo
• JSitor demo

Install

npm install ezqr-vue

(Requires Vue 3.)

Usage

<script setup>
import { EzqrGenerator } from 'ezqr-vue';
</script>

<template>
	<EzqrGenerator />
</template>

Or the default import:

<script setup>
import EzqrGenerator from 'ezqr-vue';
</script>

<template>
	<EzqrGenerator :height="640" />
</template>

Props

| Prop | Type | Default | Description | | ------------- | --------- | -------- | ----------- | | height | Number | 520 | Iframe height in pixels. Width is always 100% of the container. | | attribution | Boolean | true | Render a small "Free QR code generator by EZQR" caption below the iframe. Please keep it on - it's how we sustain the free embed. |

Sizing

Width is always 100% of the container. Wrap the component to control width:

<template>
	<div style="max-width: 500px; margin: 0 auto">
		<EzqrGenerator />
	</div>
</template>

License

MIT

Links

• EZQR - Free QR Code Generator
• Embed landing page
• ezqr-embed - vanilla-JS version
• ezqr-astro - Astro component