vue使用qrcode 生成二维码

在Vue中使用qrcode.js生成二维码，首先需要安装qrcode库：

npm install qrcode

然后在Vue组件中引入并使用qrcode：

<template>
  <div>
    <canvas ref="qrcodeCanvas"></canvas>
  </div>
</template>
 
<script>
import QRCode from 'qrcode'
 
export default {
  name: 'QrcodeComponent',
  mounted() {
    this.generateQRCode('https://example.com')
  },
  methods: {
    generateQRCode(data) {
      QRCode.toCanvas(this.$refs.qrcodeCanvas, data, error => {
        if (error) console.error(error)
        console.log('QR Code generated successfully!')
      })
    }
  }
}
</script>

在上面的例子中，我们在组件的mounted钩子中调用了generateQRCode方法，并传入了想要编码为二维码的URL。该方法使用QRCode.toCanvas函数将二维码渲染到canvas元素上。如果生成过程中发生错误，它会被回调的error参数捕获，否则会在控制台输出"QR Code generated successfully!"。