vue-qr - 二维码

1. 介绍

The Vue Component for Awesome-qr.js (opens new window)

2. 使用

安装：

npm i vue-qr

# "vue-qr": "^4.0.9",

使用：

<template>
    <VueQr
      :text="url"
      :size="300"
      :logoSrc="require('./images/logo.jpg')"
      :logoScale="0.2"
      :logoMargin="5"
      :callback="qrCodeCallback"
    >
    </VueQr>
</template>
<script>
// vue3
import VueQr from 'vue-qr/src/packages/vue-qr.vue';

export default {
  components: {
    VueQr,
  },

  data() {
    return {
      url: 'http://www.baidu.com/wahh',
    };
  },

  methods: {
    qrCodeCallback(dataUri) {
      console.log(dataUri); // data:image/png;base64, ...
    },
  },
};
</script>

3. 参考

• vue-qr —— GitHub (opens new window)