Refactor downloadImg to refs

This commit is contained in:
elweyn 2023-03-31 16:01:43 +02:00
parent e5e18288bc
commit bd29624c79

View File

@ -2,9 +2,15 @@
<div class="figure-qr-code"> <div class="figure-qr-code">
<div class="qrbox"> <div class="qrbox">
<div> <div>
<q-r-canvas :options="options" class="canvas mb-3" id="qrcanvas" /> <q-r-canvas :options="options" class="canvas mb-3" id="qrcanvas" ref="canvas" />
</div> </div>
<a id="download" download="GradidoLinkQRCode.png" href="" @click="downloadImg(this)"> <a
id="download"
ref="download"
download="GradidoLinkQRCode.png"
href=""
@click="downloadImg(this)"
>
{{ $t('download') }} {{ $t('download') }}
</a> </a>
</div> </div>
@ -44,9 +50,9 @@ export default {
}, },
methods: { methods: {
downloadImg() { downloadImg() {
const canvas = document.getElementById('qrcanvas') const canvas = this.$refs.canvas.$el
const image = canvas.toDataURL('image/png') const image = canvas.toDataURL('image/png')
document.getElementById('download').href = image this.$refs.download.href = image
}, },
}, },
} }