Accessing img src of resulting qr code

[fengyuanchen]

Accessing img src of resulting qr code

[Happy-Ferret]

NVM. I forgot about refs for a moment (or rather I actually already had one, but made a typo while trying to access it).

Anyhow. The whole thing is actually easier to do with a little bit of canvas trickery (a link element that is garbage collected soon after creation).

Here's how I save the QR code.

<template>
<div v-on:click="saveQR()">
          <qrcode
            value="Hello World!"
            tag="canvas" ref="qr" :options="{ width: 200 }"
          ></qrcode>
        </div>
</template>

<script>
export default {
  methods: {
    saveQR() {
      let img = this.$refs.qr.$el.toDataURL();
      var link = document.createElement("a");
      link.download = "QR.png";
      link.href = img;
      document.body.appendChild(link);
      link.click();
    }
  }
};
</script>