<div class="poster-qr">
<div class="qrWrapper">
<!-- 放置二维码的容器 -->
<div id="qrcode" ref="qrcode" class="qrcode"/>
</div>
<div class="qrDesc">长按扫描二维码领取</div>
</div>

  

import QRCode from 'qrcodejs2'
export default {
name: 'SharePoster',
components: { QRCode },
data() {
return {}
},
mounted() {
this.$nextTick(() => {
this.qrcode('http://www.baidu.com') // 二维码的内容,由后端返回链接
})
},
methods: {
// 生成二维码
qrcode(url) {
new QRCode(window.document.getElementById('qrcode'), {
width: window.document.getElementById('qrcode').offsetWidth,
height: window.document.getElementById('qrcode').offsetHeight,
text: url,
     colorDark: '#000',
colorLight: '#fff',
correctLevel: QRCode.CorrectLevel.H
})
    }
}

  

H5-生成二维码的更多相关文章

  1. H5生成二维码

    要用H5生成二维码: 1.引入js库,可自行点击链接复制使用 <script type="text/javascript" src="http://static.r ...

  2. h5开发app之在线生成二维码

    h5通过jquery和qrcode在线生成二维码 首先我们需要下载一个qrcode.js文件,然后依次引入jquery和qrcode文件. 1.创建一个输入框以便做演示使用: <input id ...

  3. 在UniApp的H5项目中,生成二维码和扫描二维码的操作处理

    在我们基于UniApp的H5项目中,需要生成一些二维码进行展示,另外也需要让用户可以扫码进行一定的快捷操作,本篇随笔介绍一下二维码的生成处理和基于H5的扫码进行操作.二维码的生成,使用了JS文件wea ...

  4. Python 创建本地服务器环境生成二维码

    一. 需求 公司要做一个H5手机端适配页面,因技术问题所以H5是外包的,每次前端给我们源码,我们把源码传到服务器让其他人访问看是否存在bug,这个不是很麻烦吗?有人说,可以让前端在他们的服务器上先托管 ...

  5. HTML5实现扫描识别二维码/生成二维码

    扫描识别二维码 思路: 1. 操作摄像头,获取图片.HTML5 WEBRTC的navigator.getUserMedia方法去实时获取摄像头资源.  2. 利用canvas使用相关算法分析图片识别图 ...

  6. JavaScript生成二维码图片

    1.引入一个二维码工具的js文件,同时需要引入jquery文件 下面是jquery.qrcode.min.js文件内容: (function(r){r.fn.qrcode=function(h){va ...

  7. jquery生成二维码并实现图片下载

    1.引入jquery的两个js文件 <script src="../scripts/erweima/jquery-1.10.2.min.js"></script& ...

  8. js 生成二维码图片

    1.用纯JavaScript实现的微信二维码图片生成器 QRCode.js是javascript实现二维码(QRCode)制作生成库. QRCode.js有着良好的跨浏览器兼容性(高版本使用HTML5 ...

  9. qrCode生成二维码图片

    QRCode.js 是一个用于生成二维码图片的插件. 1.文件脚本 var QRCode;!function(){function a(a){this.mode=c.MODE_8BIT_BYTE,th ...

  10. Javascript生成二维码(QR)

    网络上已经有非常多的二维码编码和解码工具和代码,很多都是服务器端的,也就是说需要一台服务器才能提供二维码的生成.本着对服务器性能的考虑,这种小事情都让服务器去做,感觉对不住服务器,尤其是对于大流量的网 ...

随机推荐

  1. 学校——DFS图的遍历

    学校实验 没什么多说的 就是实现一个图的遍历 由于学校已经输入的片段过于晦涩难懂 无法进行 在网上看了别人写的代码 提升了理解代码的一点能力 #include"string.h" ...

  2. Linux 使用Squid部署代理缓存服务

    代理缓存服务 Squid是Linux系统中最为流行的一款高性能代理服务软件,通常用作Web网站的前置缓存服务,能够代替用户向网站服务器请求页面数据并进行缓存.简单来说,Squid服务程序会按照收到的用 ...

  3. Django基础篇 02- request常用属性和返回的响应类型、pycharm创建django项目

    一.request常用属性 #django 请求对象里面的一些属性 print(request.method)#请求方式 print(request.body) #请求体 print(request. ...

  4. Importing the multiarray numpy extension module failed

    使用pyinstall打包含有numpy库的可执行程序后运行报错:Importing the multiarray numpy extension module failed 解决方法:卸载使用pip ...

  5. CentOS7/6 关闭防火墙(转载)

    CentOS6关闭防火墙使用以下命令, //临时关闭 service iptables stop //禁止开机启动 chkconfig iptables off CentOS7中若使用同样的命令会报错 ...

  6. ansible 详解基本篇

    Ansible是一种常用的自动运维化工具,基于python开发,分布式,无需客户端,轻量级,配置语言采用YAML. 安装方式yum yum install epel-release&& ...

  7. Linux系统环境下部署jar程序实现后台运行1

    [ nohup java -jar xxx.jar --spring.profiles.active=prod > 日志文件名 2>&1 & ]

  8. hdu:Shape of HDU(判断多边形凹凸)

    Problem Description话说上回讲到海东集团推选老总的事情,最终的结果是XHD以微弱优势当选,从此以后,"徐队"的称呼逐渐被"徐总"所取代,海东集 ...

  9. 量化交易-可视化展示(grafana)

    先上图 简单的实现了一下,效果还好,可玩性强 大概部署mysql+grafana step 1: 服务器:阿里云,ucloud啥的随意,配置也不需要什么,我的是阿里云1核1GB,足以 我用的ubunt ...

  10. TRACE()宏的使用

    TRACE()宏一般是用在mfc中的,用于将调试信息输出到vs的输出窗口中(这是关键), 这在使用vs作为开发工具的时候,是非常方便的. 然而在开发一般c++程序时,却貌似无法获得这样的便利,其实只要 ...