Vue 动态生成二维码 QRCode

想在页面中加入微信扫描二维码进行分享的功能，网上有demo: https://github.com/sinchang/vue-social-share

研究下QRCode 生成二维码吧，

引入：

npm install qrcode --save 

main.js中import： import QRCode from 'qrcode'

并在需要的组件中导入：  import QRCode from 'qrcode'

编写canvas :

<div>
      <canvas id="canvas"></canvas>
    </div>

------------js------------- 

useqrcode(txt) {
        //生成的二维码内容，可以添加变量
        var canvas = document.getElementById('canvas')
        QRCode.toCanvas(canvas, txt, error=>{
          if (error) console.error(error)
          console.log('二维码 生成成功!');
        })
      }

全部代码：

<template>
  <div>
    <h1>测试二维码 plan</h1>
    <Button @click="useqrcode('111