vue2 使用vue-qr生成二维码并打印二维码

npm install vue-qr --save

<template>
  <div>
    <vue-qr :value="qrValue" :size="200"></vue-qr>
    <button @click="printQRCode">打印二维码</button>
  </div>
</template>

<script>
import VueQr from 'vue-qr'

export default {
  components: {
    VueQr
  },
  data() {
    return {
      qrValue: 'https://example.com'
    }
  },
  methods: {
    printQRCode() {
      const printWindow = window.open('', '_blank');
      const qrImg = this.$el.querySelector('img').cloneNode(true);
      const style = document.createElement('style');
      style.textContent = 'img { margin: auto; display: block; }';

      printWindow.document.head.appendChild(style);
      printWindow.document.body.appendChild(qrImg);
      printWindow.document.close();
      printWindow.focus();

      printWindow.print();
      printWindow.close();
    }
  }
}
</script>