在vue中使用qrcodejs2生成二维码

叁歲伎倆 2022-10-06 00:37 211阅读 0赞

效果:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80OTQzMTk5OQ_size_16_color_FFFFFF_t_70]

// 一: 下载依赖包
    npm i qrcodejs2 --save
    
    // 二: 在使用的页面引入
    import QRCode from "qrcodejs2"; // 三: 创建展示区域的div,我是写在el-dialog中,必须用slot="footer" 包裹,不然获取不到dom元素 <div class="H5code" slot="footer"> <div id="qrcode" class="qrcode" ref="qrcode"></div> </div> //四: js代码 crateQrcode() { 
            this.$refs.qrcode.innerHTML = ""; this.qr = new QRCode("qrcode", { 
              width: 240,
              height: 240, // 高度
              text: 'https://blog.csdn.net/weixin_49431999/article/details/117769423' // 二维码内容
              // render: 'canvas' // 设置渲染方式（有两种方式 table和canvas，默认是canvas）
              // background: '#f0f'
              // foreground: '#ff0'
            });
        },

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80OTQzMTk5OQ_size_16_color_FFFFFF_t_70]: /images/20221005/4aa1ed6e23b44e79ad8d2e6c9cea18ee.png

发表评论取消回复

表情：

评论列表（有 0 条评论，211人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue生成二维码

前言本次将教大家如何只通过vue前端快速的生成二维码步骤安装依赖通过命令 npm install qrcodejs2 安装二维码生成的依

╰半夏微凉°/ 2024年04月01日 09:12/ 0 赞/ 79 阅读

相关 034：vue项目利用qrcodejs2生成二维码示例

![在这里插入图片描述][32d2a1d099334cfba6adc4f84dd79e22.png_pic_center] 第034个查看专栏目录: [VUE][] \-

客官°小女子只卖身不卖艺/ 2024年03月03日 03:20/ 0 赞/ 35 阅读

相关 Vue 生成二维码

[https://www.cnblogs.com/TreeCTJ/p/12736833.html][https_www.cnblogs.com_TreeCTJ_p_127368

灰太狼/ 2022年11月27日 03:22/ 0 赞/ 218 阅读

相关在vue中使用qrcodejs2生成二维码

效果: ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmN

叁歲伎倆/ 2022年10月06日 00:37/ 0 赞/ 212 阅读

相关 vue——微信二维码显示vue-qr/qrcodejs2

微信二维码之vue-qr/qrcodejs2 区别 vue-qr 弊端：当后端微信返回二维码，不兼容IE浏览器 npm install vue-qr --

悠悠/ 2022年09月14日 11:22/ 0 赞/ 335 阅读

相关使用Zxing生成二维码，以及在生成的二维码中添加logo

最近研究了Zxing的源码，以及它的一些常用的用法，感触也是很深，也提高了不少，网上也找了各种写法，要真正的理解这一整套东西还是要花费些经历的，涉及的知识面还是有一些的，下面

梦里梦外;/ 2022年05月30日 20:20/ 0 赞/ 244 阅读

相关 vue中动态生成二维码

二维码的url是url+动态参数，完美兼容，亲试可用！ [vue项目中动态生成二维码][vue] 有问题关注公众号：wander\_yun。原则：只分享经过实践，测

偏执的太偏执、/ 2022年04月22日 02:08/ 0 赞/ 316 阅读

相关在H5中使用qrcode, qrcodejs2生成二维码

在H5中使用qrcode生成二维码安装插件 ```javascript npm install --save qrcode ``` 使

客官°小女子只卖身不卖艺/ 2022年03月15日 06:26/ 0 赞/ 533 阅读

相关 Vue中使用二维码插件qrcodejs2生成二维码

1.安装 qrcodejs2 npm install qrcodejs2 --save 2.在需要使用的组件内引入 <script>

深藏阁楼爱情的钟/ 2022年01月15日 02:03/ 0 赞/ 676 阅读

相关 vue - 使用qrcodejs2生成二维码

效果图： ![在这里插入图片描述][20191010112856472.png] ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naG

你的名字/ 2021年09月29日 09:42/ 0 赞/ 940 阅读