码迷,mamicode.com
首页 > Web开发 > 详细

vue 与qrcodejs2 生成的二维码 logo 居中

时间:2020-09-17 13:19:09      阅读:65      评论:0      收藏:0      [点我收藏+]

标签:高度   内容   style   strong   生成   nim   rem   rom   this   

 代码:
<div class="qrcode" >
      <img src="图片地址" v-if="iconIMGurl===‘0‘?false:true"  class="logoimg"/>
      <div ref="qrcode" id="qrcode">
      </div>
    </div>
 
 
style:
.qrcode{
  display:inline-block;
  position:relative;margin-top: .2rem;
}
.logoimg{
    position:absolute;
    left:50%;
    top:50%;
    width:60px;
    height:60px;
    margin-top:-30px;
    margin-left:-30px;
}
 
 
js:
import QRcode from ‘qrcodejs2‘   //引入
qrcode() {
      this.qrcode = new QRcode(‘qrcode‘, {
        width: 200, // 设置宽度,单位像素
        height: 200, // 设置高度,单位像素
        text: this.QRtext, // 设置二维码内容或跳转地址
        colorDark: this.erweiCodeColor // 二维码的颜色
      })
    }
 

vue 与qrcodejs2 生成的二维码 logo 居中

标签:高度   内容   style   strong   生成   nim   rem   rom   this   

原文地址:https://www.cnblogs.com/wz2018/p/13614725.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!