Skip to content
This repository has been archived by the owner. It is now read-only.
Permalink
Branch: master
Find file Copy path
Find file Copy path
2 contributors

Users who have contributed to this file

@theomessin @yx-engineering
107 lines (104 sloc) 2.5 KB
<template>
<div>
<canvas ref="qrcode"></canvas>
</div>
</template>
<script>
import Qrious from 'qrious'
export default {
data() {
return {qrious: null};
},
props: {
background: {
type: String,
default: 'white'
},
backgroundAlpha: {
type: Number,
default: 1.0
},
foreground: {
type: String,
default: 'black'
},
foregroundAlpha: {
type: Number,
default: 1.0
},
level: {
type: String,
default: 'L'
},
mime: {
type: String,
default: 'image/png'
},
padding: {
type: Number,
default: null
},
size: {
type: Number,
default: 100
},
value: {
type: String,
required: true
}
},
watch: {
background () {
this.qrious.background = this.background;
},
backgroundAlpha () {
this.qrious.backgroundAlpha = this.backgroundAlpha;
},
foreground () {
this.qrious.foreground = this.foreground;
},
foregroundAlpha () {
this.qrious.foregroundAlpha = this.foregroundAlpha;
},
level () {
this.qrious.level = this.level;
},
mime () {
this.qrious.mime = this.mime;
},
padding () {
this.qrious.padding = this.padding;
},
size () {
this.qrious.size = this.size;
},
value () {
this.qrious.value = this.value;
}
},
mounted () {
const element = this.$refs.qrcode;
const background = this.background;
const backgroundAlpha = this.backgroundAlpha;
const foreground = this.foreground;
const foregroundAlpha = this.foregroundAlpha;
const level = this.level;
const mime = this.mime;
const padding = this.padding;
const size = this.size;
const value = this.value;
this.qrious = new Qrious({
element,
background,
backgroundAlpha,
foreground,
foregroundAlpha,
level,
mime,
padding,
size,
value
});
}
}
</script>
You can’t perform that action at this time.