vue 使用vue-qr生成二维码和logo展示

996 阅读1分钟
先安装 npm install vue-qr --save

在页面单独引入
import VueQr from 'vue-qr'

组件注册
 components: {
    VueQr
  }
  
 
  <VueQr 
    :logoCornerRadius="4"  //LOGO 标识及其边框的圆角半径, 默认为0
    :logoMargin="1"  //LOGO 标识周围的空白边框, 默认为0
    :logoBackgroundColor="'white'"  //Logo 背景色,需要设置 logo margin
    :logoSrc="require('@/assets/images/tifanglogo.png')"  //嵌入至二维码中心的 LOGO 地址
    :text="currentRow.url" //欲编码的内容
    :size="205"  // 尺寸, 长宽一致, 包含外边距
    :margin="6" //二维码图像的外边距, 默认 20px
    :dotScale="0.9" /> //(0 < scale < 1.0) default 0.35 数据区域点缩小比例,默认为0.35