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{
width: 4rem!important;
height: 4rem!important;
margin:rem(40) auto 0;
.qrcode{
width: 4rem!important;
height: 4rem!important;
}
}
vue使用qrcode生成二维码,可以自定义大小的更多相关文章
- vue 使用QRcode生成二维码或在线生成二维码
参考:https://blog.csdn.net/zhuswy/article/details/80267748 1.安装qrcode.js npm install qrcodejs2 --save ...
- C# 利用QRCode生成二维码图片
网上生成二维码的组件是真多,可是真正好用的,并且生成速度很快的没几个,QRCode就是我在众多中找到的,它的生成速度快.但是网上关于它的使用说明,真的太少了,大都是千篇一律的复制粘贴.这是本要用它做了 ...
- 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( ...
- 使用jquery.qrcode生成二维码实现微信分享功能
前言: 最近有个这样的需求,在pc端的商品详情页增加分享功能. 微博分享.QQ好友分享.QQ空间分享这些都很常见.但是微信分享我还没有手动写过(以前改过). 最终效果如下图: 解决方案:使用jquer ...
- QRCode生成二维码,jq QRCode生成二维码,QRCode生成电子名片
[QRCode官网]http://phpqrcode.sourceforge.net/ PHP QRCode生成二维码 官网下载QRCode源码包,引入源码包中的 qrlib.php . <?p ...
随机推荐
- ajax(Asynchronous JavaScript and XML) 异步js或者xml
1.XMLHttpRequest 对象:向服务器发送局部的请求,异步获取执行 a.浏览器支持 b.语法: xmlhttp==new XMLHttpRequest(); xmlhttp.open(&qu ...
- vue-i18n.esm.js?a925:14 [vue-i18n] Value of key '图标管理' is not a string!
解决方案:在项目的index.js文件中修改配置,让在创建 i18n 示例的时候加上参数去掉这些 warning const i18n = new VueI18n({ locale: lang, // ...
- Ajax轮询 select循环输出
弹出层 <include file="Pub:header"/> <style> .del{color:red} .addname{color:#337ab ...
- (C/C++) Link List - C++ 版本
利用C++寫一個基本的 Link list 練習,功能包含 pint list.CreatList.Insert.Delete.Reverse.Search.Clear.GetLen. 先建立相關的C ...
- python---day14( 内置函数二)
内置函数二一:匿名函数 lambda函数 lambda 表示匿名函数,不需要用def 来申明. 语法: 函数名=lambda 参数:返回值 ----〉 案例:f=lambda n:n*n 例子01: ...
- [BZOJ 3262]陌上开花
今天写了到偏序问题,发现博主真的是个傻X 传送门 以前的写法 /************************************************************** Probl ...
- 查找表set和map 349, 350
两类查找问题: 1)查找有无: - 某个元素是否存在,通常使用set(集合) 2)查找对应关系(键值对应) - 某个元素出现了几次,map(字典) set和map都不允许里面的键值重复. 常见操作: ...
- 二分查找-数组实现(小trick)
template<typename T> int binarySearch(T arr[], int n, T target){ , r = n-; //在[l...r]范围内寻找targ ...
- Advanced Data Structures in competitive programming
1.bit #define isOn(S, j) (S & (1 << j)) #define setBit(S, j) (S |= (1 << j)) #define ...
- C++ STL之Set
set是关联容器,类似于集合. 特点是里面的元素不会重复,而且元素时有序的. 1.声明定义: #include<set> using namespace std; set<int&g ...