前端vue生成二维码带logo并且可以点击下载保存_vue实现扫描二维码

前端vue生成二维码带logo并且可以点击下载保存_vue实现扫描二维码下载插件:npminstallvue-qr<template><divclass=”sg-qrcode”><vue-qr:text=”qrcodeText”:correctLevel=”3″:size=”250″:margin=”10″colorDark=”#000″colorLight=”white”backgroundColor=”w…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

下载插件:npm install vue-qr

<template>

  <div class=”sg-qrcode”>

    <vue-qr

      :text=”qrcodeText”

      :correctLevel=”3″

      :size=”250″

      :margin=”10″

      colorDark=”#000″

      colorLight=”white”

      backgroundColor=”white”

      backgroundDimming=”white”

      :logoSrc=”require(‘@/assets/logo.png’)”

      :logoScale=”.2″

      :logoMargin=”5″

      logoBackgroundColor=”white”

    ></vue-qr>

  </div>

</template>

<script>

import vueQr from “vue-qr”; // 引入二维码生成组件

export default {

  components: {

    vueQr // 二维码生成组件

  },

  data() {

    return {

      qrcodeText: “测试二维码” //二维码内容(扫码识别后需要访问的网址)

    };

  }

  // 属性说明:

  // text 编码的内容(支持文字、网址)

  // correctLevel 容错级别 0-3(容错级别越高,代表遮住二维码部分越多,依然可以识别)

  // size 尺寸, 长宽一致, 包含外边距(推荐20px)

  // margin 二维码图像的外边距, 默认20px

  // colorDark 实点的颜色(默认黑色)

  // colorLight 空白区的颜色(默认白色)

  // bgSrc 嵌入的背景图地址(支持png、jpg)

  // gifBgSrc 欲嵌入的背景图 gif 地址,设置后普通的背景图将失效。设置此选项会影响性能

  // backgroundColor 背景色(默认白色)

  // backgroundDimming 叠加在背景图上的颜色, 在解码有难度的时有一定帮助(默认白色)

  // logoSrc 嵌入至二维码中心的 LOGO 地址(支持png、jpg)

  // logoScale 用于计算 LOGO 大小的值, 过大将导致解码失败, LOGO 尺寸计算公式 logoScale*(size-2*margin),(默认 0.2)

  // logoMargin LOGO标识周围的空白边框, 默认为0(推荐5px)

  // logoBackgroundColor Logo 背景色,需要设置 logo margin(默认白色)

};

</script>

前端vue生成二维码带logo并且可以点击下载保存_vue实现扫描二维码

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/186273.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Maven环境的搭建[通俗易懂]

    Maven环境的搭建[通俗易懂]前言:项目需要的外jar包的时候,这时候建立一个普通的web项目是一个比较头痛的事,它需要新建web项目,配置好tomcat(8.0),然后手动复制所需jar到lib下面然后addbuildpath,把需要的jar都下载好并且导入(太麻烦,不灵活),而且可能项目中的框架比较多,导入的jar包有重复的,那么导入重复的jar包启动项目肯定会报错,所以博主教大家手把手搭建maven环境,使用…

    2022年5月14日
    38
  • java 激活码【最新永久激活】

    (java 激活码)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html1PA3AFINM4-eyJsa…

    2022年3月31日
    78
  • Latex数学公式-求导、分数的表示

    Latex数学公式-求导、分数的表示表示方法\frac{}{}:分数表示\partial:偏导符号代码效果意义\frac{x}{y}xy\frac{x}{y}yx​分数\partial∂\partial∂偏导符号举例$$\frac{\partialy}{\partialx_1}+\frac{\partialy}{\partialx_2}$$显示效果如下:∂y∂…

    2022年6月23日
    135
  • 新手小白学JAVA 数组 数组工具类 二维数组

    新手小白学JAVA 数组 数组工具类 二维数组1数组1.1概念数组Array,标志是[],用于储存多个相同类型数据的集合想要获取数组中的元素值,可以通过脚标(下标)来获取数组下标是从0开始的,下标的最大值是数组的长度减11.2创建数组数组的创建方式一般分为动态初始化和静态初始化动态初始化int[]a=newint[5];静态初始化int[]b=newint[]{1,2,3,4,5};int[]c={1,2,3,4,5};1.3创建数组过程分析程序创建数组int[]a=new

    2022年5月1日
    38
  • IDEA中Activate Power Mode插件 取消抖动

    IDEA中Activate Power Mode插件 取消抖动IDEA插件取消抖动

    2022年7月14日
    36
  • httprunner3源码解读(4)parser.py「建议收藏」

    httprunner3源码解读(4)parser.py「建议收藏」源码结构目录可以看到此模块定义了4个属性和12个函数,我们依次来讲解属性源码分析#匹配http://或https://absolute_http_url_regexp=re.compil

    2022年8月7日
    7

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号