Vue生成二维码_后端生成二维码还是前端

 <!-- 分享 -->
      <div class="rightimg" @click="share">
        <img src="../assets/img/share.png" />
      </div>

 <!-- vant引入遮罩层，生成二维码 -->
    <van-overlay :show="show" @click="show = false">
      <div class="wrapper">
        <div class="block">
          <p>分享</p>
          <div>
          //存放二维码的图片
            <img :src="imgUrl" />
          </div>
        </div>
      </div>
    </van-overlay>

data() { 
   
    return { 
   
      // 控制遮罩层显示隐藏
      show:false,
      // 图片路径
      imgUrl:""
    };
  },

import QRCode from 'qrcode'  //在哪使用就在哪引用
QRCode.toDataURL('I am a pony!')
  .then(url => { 
   
    console.log(url)
  })
  .catch(err => { 
   
    console.error(err)
  })

// 分享
share() { 

//点击显示遮罩层
this.show = true;
//获取当前地址栏的地址
let url = location.href;
console.log(url);  
//把当前地址栏的路径放到toDataURL后面，就会生成二维码
QRCode.toDataURL(url)
.then(img => { 

console.log(img);
//把生成的二维码赋值给上面定义好的imgUrl 
this.imgUrl = img;
})
//错误返回信息
.catch(err => { 

console.error(err);
});
}