zoukankan      html  css  js  c++  java
  • vue使用qrcode生成二维码,可以自定义大小

    1,qrcanvas-vue插件,https://gera2ld.github.io/qrcanvas-vue/#logo。只支持像素大小的二维码



    2,qrcode支持移动端自定义大小二维码


    "qrcode": "^1.2.2",
    import QRCode from 'qrcode';


    <div class="qrcode_box">
    <canvas class="qrcode"></canvas>
    </div>


    _this.urlData为请求过来的url地址

    渲染:
    var canvas = document.querySelector('canvas')
    QRCode.toCanvas(canvas, this.urlData)

    css:

    生成二维码之后在canvas标签里有style样式(单位为px),!important的层级比style要高,实现自定义大小
    .qrcode_box{
    4rem!important;
    height: 4rem!important;
    margin:rem(40) auto 0;
    .qrcode{
    4rem!important;
    height: 4rem!important;
    }
    }







  • 相关阅读:
    适配器模式
    事务
    JUnit4
    命令模式
    组合模式
    MySQL语法
    MyEclipse工具
    数据源和连接池
    Annotation
    Java反射机制
  • 原文地址:https://www.cnblogs.com/lwj820876312/p/9621511.html
Copyright © 2011-2022 走看看