vue 使用QRcode生成二维码或在线生成二维码
参考:https://blog.csdn.net/zhuswy/article/details/80267748
1.安装qrcode.js
npm install qrcodejs2 --save
2.页面中引入
import QRCode from 'qrcodejs2'
3.页面使用
<div id="qrcode" ref="qrcode"></div>
methods:{
qrcode () {
let qrcode = new QRCode('qrcode', {
width: 232, // 设置宽度
height: 232, // 设置高度
text: 'https://baidu.com'
})
}
}
/*
@ 在需要调用的地方 这样必须这样调用 否则会出现 appendChild null 就是id为qrcode的dom获取不到 返回结果为null
*/
this.$nextTick (function () {
this.qrcode();
})
更简单直接的方法:
src = "http://qr.topscan.com/api.php?bg=ffffff&fg=000000&text=" + code; //code为券码
vue 使用QRcode生成二维码或在线生成二维码的更多相关文章
- 在线生成二维码的API接口
现在很多大网站都有这样的一个功能,使用手机扫描一下网页上的二维码便可快速在手机上访问网站.想要实现这样的功能其实很简单,下面麦布分享几个在线生成网址二维码的API接口.都是采用http协议接口,无需下 ...
- 推荐六个在线生成网址二维码的API接口
现在很多大网站都有这样的一个功能,使用手机扫描一下网页上的二维码便可快速在手机上访问网站.想要实现这样的功能其实很简单,下面麦布分享几个在线生成网址二维码的API接口.都是采用http协议接口,无需下 ...
- C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和边框宽度的二维码
本文介绍在 C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和边框宽度的二维码.网上文章大多只是简单介绍内置参数的设置,根据我的使用目的,增加了自定义目标二维码图片尺寸和白边 ...
- 【转】C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和边框宽度的二维码
本文介绍在 C# 中使用 ThoughtWorks.QRCode.dll 生成指定尺寸和边框宽度的二维码.网上文章大多只是简单介绍内置参数的设置,根据我的使用目的,增加了自定义目标二维码图片尺寸和白边 ...
- QrCode C#生成二维码 及JavaScript生成二维码
一 C#的二维码 示例: class Program { static void Main(string[] args) { QrEncoder qrEncoder = new QrEncode ...
- QRCode二维码生成方案及其在带LOGO型二维码中的应用(1)
原文:QRCode二维码生成方案及其在带LOGO型二维码中的应用(1) 提要:很多公司为商业宣传之需,常将企业LOGO加入二维码中,但如果LOGO遮挡区域足够地大,二维码就变得无法识别.那么,有没有一 ...
- QRCode二维码生成方案及其在带LOGO型二维码中的应用(2)
原文:QRCode二维码生成方案及其在带LOGO型二维码中的应用(2) 续前:QRCode二维码生成方案及其在带LOGO型二维码中的应用(1) http://blog.csdn.net/johnsu ...
- vue 把后端返回的图片和url链接生成的二维码用canvas 合成一张图片
H5 页面在做某个活动的时候,有两种分享方式,一种是链接分享,一种是图片分享. 链接分享的话,如果是在微信里,就可引导用户利用微信浏览器自带的分享,根据sdk设置分享标题简介链接缩略图即可. 图片分享 ...
- jquery.qrcode.js生成二维码(前端生成二维码)
官网地址:http://jeromeetienne.github.io/jquery-qrcode/ 第一步引入插件: <script type='text/javascript' src='h ...
随机推荐
- JS对象 字符串分割 split() 方法将字符串分割为字符串数组,并返回此数组。 语法: stringObject.split(separator,limit)
字符串分割split() 知识讲解: split() 方法将字符串分割为字符串数组,并返回此数组. 语法: stringObject.split(separator,limit) 参数说明: 注意:如 ...
- 2019.2.23VScode的c++配置详细方法
根据个人经验,最新的c++配置方法. 主要的步骤: 安装Vscode 在Vscode类安装c++插件 安装编译调试环境 修改Vscode配置文件. 安装Vscode的步骤省略 如何配置Vscode中文 ...
- C++ SOCKET 基础编程
{ http://c.biancheng.net/socket/ }
- ROS 自定义消息类型方法
流程 1.在package中新建文件夹名为msg 2.在msg文件夹中创建消息(此处以my_msg.msg)为例,注意的是要以msg为后缀名 内容举例如下: int32 data1 float64 d ...
- hibernate_06_hibernate的延迟加载和抓取策略
1.延迟加载 1>类级别的延迟加载 指的是通过oad方法查询某个对象的时候,是否采用延迟, session. load(Customer class1L) 类级别延迟加载通过<class& ...
- 第十篇:javaScript中的JSON总结
参考网站:json中国,MDN json 一.必知基础 JSON 是JavaScript对象文字符号的一个子集,它可以自如的在JavaScript中使用.看下这个对象: var myJSONOb ...
- 2019 Multi-University Training Contest 7 Kejin Player Final Exam
Kejin Player 期望DP 题意: 初始等级为1,每一级有四个参数 r , s , x , a . 每一级有一个概率p=r/s花费a的代价升级到下一级,失败可能会倒退到x级 设从 l 到 r ...
- C# 中的三个高级参数 ref
今天在浏览博文时,看到这篇文章:C#中的ref 传进出的到底是什么 ? 在传对象时使用ref的疑问 引用类型就传的就是地址,值类型传的就是值,可是还仍有那么多人迷惑,网上虽然流传着很多ref 的相关文 ...
- java笔试之求最大连续bit数
功能: 求一个byte数字对应的二进制数字中1的最大连续数,例如3的二进制为00000011,最大连续2个1 输入: 一个byte型的数字 输出: 无 返回: 对应的二进制数字中1 ...
- Activiti业务键(businessKey)
问题:如何让业务对象和对应的流程 关联? 发现ProcessInstance 有个方法getBusinessKey()可以得到一个businessKey. ProcessInstance 对应数据库中 ...