vue + element-ui + qrcodejs2 实现二维码生成
1、在所在项目下安装插件
npm i qrcodejs2
2、在需要生成二维码的页面引入qrcodejs
import QRCode from 'qrcodejs2'
3、使用
<el-button size="mini" type="primary" icon="el-icon-picture-outline" round @click="GenerateQRCode()">生成二维码</el-button></div>
<div id="qrcode" ref="qrcode"></div>
回调函数
// 生成二维码
GenerateQRCode () {
document.getElementById('qrcode').innerHTML = '' // 防止一直点击按钮重复生成二维码
const qrcode = new QRCode('qrcode', {
width: 200, // 二维码宽度,单位像素
height: 200, // 二维码高度,单位像素
text: this.softLink, // 生成二维码的链接
})
console.log('二维码信息:', qrcode)
},
}
vue + element-ui + qrcodejs2 实现二维码生成的更多相关文章
- JavaScript二维码生成——qrcode.js
在开发中,有时候,我们需要根据不同的内容来动态生成二维码,则可以使用qrcode.js这个小插件来实现. 1.qrcode.js文件内容: (1)未压缩(qrcode.js): /** * @file ...
- 二维码生成插件qrious及网站扫码登录的一些理解
什么是二维码 二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据类型. ...
- 二维码生成插件qrious
1.qrious是基于canvas的纯JS二维码生成插件 1.1什么是二维码 二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的B ...
- simple go web application & 二维码生成 & 打包部署
go语言简易web应用 & 二维码生成及解码 & 打包部署 转载请注明出处: https://www.cnblogs.com/funnyzpc/p/10801476.html 前言(闲 ...
- [开源]C#二维码生成解析工具,可添加自定义Logo
二维码又称 QR Code,QR 全称 Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的 Bar Code 条形码能存更多的信息,也能表示更多的数据类型:比如:字 ...
- 聊聊 Web 项目二维码生成的最佳姿势
在设计和实现的过程之后,你永远不知道部署上去的程序会已什么样的姿势运行. 本篇借一次生成二维码逻辑的不同实现,阐述 Web 项目中二维码生成的正确姿势. 文中如有批量,欢迎各位看客老爷拍砖.试运行前5 ...
- .NET 二维码生成(ThoughtWorks.QRCode)
引用ThoughtWorks.QRCode.dll (源代码里有) 1.简单二维码生成及解码代码: //生成二维码方法一 private void CreateCode_Simple(string n ...
- iOS开发 二维码生成
基于libqrencode的二维码生成 + (void)drawQRCode:(QRcode *)code context:(CGContextRef)ctx size:(CGFloat)size { ...
- PHP二维码生成的方法(google APi,PHP类库,libqrencode等)
原文地址: http://blog.csdn.net/liuxinmingcode/article/details/7910975 ================================== ...
- Android 二维码 生成和识别(附Demo源码)
今天讲一下目前移动领域很常用的技术——二维码.现在大街小巷.各大网站都有二维码的踪迹,不管是IOS. Android.WP都有相关支持的软件.之前我就想了解二维码是如何工作,最近因为工作需要使用相关技 ...
随机推荐
- 使用 JWT 生成 token
JWT 简介 JWT:Json Web Token 官网:https://jwt.io 优点:可生成安全性较高的 token 且可以完成时效性的检验(登陆过期检查) JWT 结构:(由官网获取) JW ...
- .NET性能优化-使用内存+磁盘混合缓存
我们回顾一下上一篇文章中的内容,有一个朋友问我这样一个问题: 我的业务依赖一些数据,因为数据库访问慢,我把它放在Redis里面,不过还是太慢了,有什么其它的方案吗? 其实这个问题比较简单的是吧?Red ...
- Java锁的逻辑(结合对象头和ObjectMonitor)
我们都知道在Java编程中多线程的同步使用synchronized关键字来标识,那么这个关键字在JVM底层到底是如何实现的呢. 我们先来思考一下如果我们自己实现的一个锁该怎么做呢: 首先肯定要有个标记 ...
- 关于vlc"编解码器暂不支持: VLC 无法解码格式“MIDI” (MIDI Audio)"解决
解决办法 sudo apt install vlc-plugin-fluidsynth
- odoo关于计算字段store=True时导致的安装/更新时间较长问题的解决方案
Odoo安装/更新模块原理 Odoo每次安装/更新模块时,会进行以下几步处理: 1.判断是否需要创建表,如果需要创建且表不存在,则进行表的创建(不进行字段的创建): 2.获取该表中已经存在的字段: 3 ...
- 【CDH数仓】Day02:业务数仓搭建、Kerberos安全认证+Sentry权限管理、集群性能测试及资源管理、邮件报警、数据备份、节点添加删除、CDH的卸载
五.业务数仓搭建 1.业务数据生成 建库建表gmall 需求:生成日期2019年2月10日数据.订单1000个.用户200个.商品sku300个.删除原始数据. CALL init_data('201 ...
- 个人电脑公网IPv6配置
一.前言 自己当时以低价买的阿里ECS云服务器马上要过期了,对于搭建个人博客.NAS这样服务器的需求购买ECS服务器成本太高了,刚好家里有台小型的桌面式笔记本,考虑用作服务器,但是公网IPv4的地址实 ...
- 使用NPOI core插入图片
闲的无聊,封装一个NPOI core插入图片,下面贴上代码,有注释,我就不讲解了 public class ExcelHelper { /// <summary> /// excel插入图 ...
- Redis的数据持久化
介绍 Redis 的数据持久化方案 Redis 的数据持久化主要有两大机制,AOF 日志和 RDB 快照. AOF 持久化是通过保存 Redis 服务器所执行的写命令来记录数据库状态. RDB 持久化 ...
- 区块链,中心去,何曾着眼看君王?用Go语言实现区块链技术,通过Golang秒懂区块链
区块链技术并不是什么高级概念,它并不比量子力学.泡利不相容原则.哥德巴赫猜想更难以理解,但却也不是什么类似"时间就是金钱"这种妇孺皆知的浅显道理.区块链其实是一套统筹组织记录的方法 ...