前端使用-qrcode-生成二维码

没有多余的前奏直接上代码:

  • html:

    <div id="qrcode"></div>
    
  • js:

     export default {
          data(){
    	        return{
    	          	http: '',
    	        }
          },
          created(){
    	        this.http = 'https://h5.dingtalk.com/open-market/skuDetail.html?dd_share=false&showmenu=false&goodsCode=DD_GOODS-101001045015&articleCode=DD_GOODS-101001045015&bizCode=isv&funnelsource=isv_app_yunzichan&corpId=' + this.userInfo.corpId
    	        this.openCode()
          },
          methods:{
    	        qrcode () {
    		          let qrcode = new QRCode("qrcode", {
    			            width: 200, // 二维码宽度,单位像素
    			            height: 200, // 二维码高度,单位像素
    			            correctLevel: 3,
    			            text: this.http  // 生成二维码的内容
    		          });
    	        },
    	        openCode(){
    		          this.$nextTick(() => {
    		            	this.qrcode();
    		          })
    	        },
          }
     }
    
  • 注意:correctLevel: 3,这句一定要加,为了防止二维码内容过长,导致不能生成二维码并且报错;

    在这里插入图片描述

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值