You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
1.2 KiB
64 lines
1.2 KiB
<template>
|
|
<div class="qrbox">
|
|
<canvas :canvas-id="id" :style="{
|
|
width:`100%`,
|
|
height:`100%`,
|
|
}"></canvas>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import uQRCode from "@/js_sdk/Sansnn-uQRCode/uqrcode.js";
|
|
export default {
|
|
props: {
|
|
text: {
|
|
default: "",
|
|
type: String,
|
|
required: false,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
width: 100,
|
|
height: 100,
|
|
id: `qrcode${Math.random()}`,
|
|
};
|
|
},
|
|
watch: {
|
|
text() {
|
|
this.getRec();
|
|
},
|
|
},
|
|
methods: {
|
|
// 获取尺寸
|
|
getRec() {
|
|
let query = uni.createSelectorQuery().in(this);
|
|
query
|
|
.select(".qrbox canvas")
|
|
.boundingClientRect((e)=> {
|
|
this.width = e.width
|
|
this.height = e.height
|
|
this.make()
|
|
})
|
|
.exec();
|
|
},
|
|
make() {
|
|
uQRCode.make({
|
|
canvasId: this.id,
|
|
componentInstance: this,
|
|
text: this.text,
|
|
size: this.width,
|
|
margin: 0,
|
|
backgroundColor: '#ffffff',
|
|
foregroundColor: '#000000',
|
|
fileType: 'jpg',
|
|
correctLevel: uQRCode.errorCorrectLevel.H,
|
|
success: res => {
|
|
}
|
|
})
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getRec();
|
|
},
|
|
};
|
|
</script>
|