Vue前端利用qrcode生成二维码
<div id="qrcode" style="width: 560px;height: 560px;background-color: white;"></div>
</div> </div>
</template> <script>
import QRCode from 'qrcodejs2';
import Cookie from 'vue-cookies';
export default {
name: "binding-weixin",
data(){
return{
qrcode:''
}
},
methods:{
getBindUserQcode:function(){
let csrftoken = Cookie.get('csrftoken');
this.$axios.request({
url:this.$store.state.apiList.bindingWeixin,
method:'get',
// params: {foo: 'bar'},
headers: {"X-CSRFToken":csrftoken }
}).then(res=>{
this.qrcode.clear();
this.qrcode.makeCode(res.data.data);
console.log(res.data.data,22222222222222222)
}).catch(res=>{
console.log(res,1111111111111111111)
})
}
},
mounted(){
this.qrcode = new QRCode('qrcode',{
text:'', # 二维码内容
width:200,
height:200,
// render: 'canvas' // 设置渲染方式(有两种方式 table和canvas,默认是canvas)
colorDark:'#000000', #前景色
colorLight:'#ffffff', #背景色
correctLevel:3
})
}
}
Vue前端利用qrcode生成二维码的更多相关文章
- C# 利用QRCode生成二维码图片
网上生成二维码的组件是真多,可是真正好用的,并且生成速度很快的没几个,QRCode就是我在众多中找到的,它的生成速度快.但是网上关于它的使用说明,真的太少了,大都是千篇一律的复制粘贴.这是本要用它做了 ...
- asp.net(C#)利用QRCode生成二维码---.NET菜鸟的成长之路
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="QRCode.aspx.cs&q ...
- asp.net(C#)利用QRCode生成二维码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="QRCode.aspx.cs&q ...
- asp.net(C#)利用QRCode生成二维码(续)-在二维码图片中心加Logo或图像
<%@ WebHandler Language="C#" Class="GetQRCode" %> using System; using Syst ...
- Qrcode生成二维码的参数总结 及最小尺寸的测试
Qrcode生成二维码,做过很多实验,探索最小规格的二维码到底是多少尺寸,和最高规格的二维码到底是多大尺寸.现在我总结总结: 有两种思路: 1.生成规格高的二维码,然后压缩到自己想要的尺寸的二维码.这 ...
- qrcode 生成二维码
qrcode 生成二维码 Demo: https://www.hgnulb.cn/freedom/qrcode/qrcode.html qrcodeGithub 地址: https://github. ...
- 使用jquery.qrcode生成二维码及常见问题解决方案
转载文章 使用jquery.qrcode生成二维码及常见问题解决方案 一.jquery.qrcode.js介 jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery ...
- C#Qrcode生成二维码支持中文,带图片,带文字
C#Qrcode生成二维码支持中文带图片的操作请看二楼的帖子,当然开始需要下载一下C#Qrcode的源码 下载地址 : http://www.codeproject.com/Articles/2057 ...
- python_使用qrcode生成二维码
1.功能 使用qrcode生成二维码 2.代码 #生成二维码: import qrcode #根据url生成二维码 def qrcodeWithUrl(url): img = qrcode.make( ...
随机推荐
- Vue实现tab选项卡
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- springdata 使用plql更新时候注意点 ?2 表示从方法中获取第二个形参的值 ?1表示从方法中获取第一个值
1.query表示的是查询 需要在操作update的方法上再次添加一个注解modifying 2.plql不是springdatajpa自带的sql功能自带的功能 自动有事务: 所以需要我们手动在se ...
- Server酱
功能:从服务器推报警和日志到手机上的工具 使用: 发送消息非常简单,只需要向以下URL发一个GET或者POST请求: https://sc.ftqq.com/SCU34756Ta63843ce61a3 ...
- 2.4 random 模块
- CF209C Trails and Glades
题目链接 题意 有一个\(n\)个点\(m\)条边的无向图(可能有重边和自环)(不一定联通).问最少添加多少条边,使得可以从\(1\)号点出发,沿着每条边走一遍之后回到\(1\)号点. 思路 其实就是 ...
- java.io.FileNotFoundException:my-release-key.keyStore拒绝访问
安卓生成APK的时候,生成密钥的时候报java.io.FileNotFoundException:my-release-key.keyStore拒绝访问的错误 这是因为权限问题:你的jdk目录在c盘, ...
- mysql 单列无重复
ALTER TABLE jeesite.bb_bill ADD UNIQUE (object_id);
- https://www.chromestatus.com/features/5093566007214080
移动端滑动报错:Unable to preventDefault inside passive event listener due to target being treated as passiv ...
- Teamviewer远程ssh命令行更改密码启动
Teamviewer远程ssh命令行更改密码启动 设置密码 $ sudo teamviewer passwd [NewPasswd ] 查看teamviewer信息 $ teamviewer info ...
- SpringBoot系列: Maven多项目管理
这篇是 maven 项目管理的第二篇, 讲解使用 maven 进行多个项目管理, 之前有一篇是 maven 的基础知识. SpringBoot系列: Eclipse+Maven环境准备 一个完整的解决 ...