<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. 1.3 选择IDE

    选择IDE 使用过的IDE 1.DEV-C++ 配合使用语言:C.C++ 个人体验:支持代码补全,信息竞赛遗留物,招很多入门教材喜欢,十分古老缺乏维护,功能简洁,安装完打开直接编译很方便,代码提示让人 ...

  2. 解决:pytesseract.pytesseract.TesseractNotFoundError: tesseract is not installed or it‘s not in your PATH. See README file for more information.

    问题:使用pytesseract库识别图片中文字时出现报错 代码: import pytesseract from PIL import Image,ImageEnhance img=Image.op ...

  3. DAST精简代码

    先训练G:先不计算D的梯度: 判别器输入类型为(源域,0)或者(目标域,1),输出图片为真实图片(源域)的概率值for param in model_D.parameters(): # model_D ...

  4. windows10安装ubuntu18.04(64位)双系统教程

    系统安装教程链接:https://www.cnblogs.com/masbay/p/11627727.html 系统安装完成后安装显卡驱动:https://ywnz.com/linux/4573.ht ...

  5. uniapp 报错 签名不对 请检查签名是否与开放平台上填写的一致

    问题描述 用签名工具 输入包名   获取签名 在微信开放平台申请app 用获取的签名申请 申请成功后  在hbuilderx上云打包apk 分享 报  签名不对  请检查签名是否与开放平台上填写的一致 ...

  6. 【alive-progress】Python控制台输出动态进度条

    简介 alive-progress是一种具有实时吞吐量和非常酷的动画新型的进度条python库. 使用 from alive_progress import alive_bar import time ...

  7. 西瓜书3.3 尝试解题(python)对率回归 极大似然估计

    数据如下: x01=[0.697,0.774,0.634,0.608,0.556,0.403,0.481,0.437,0.666,\ 0.243,0.245,0.343,0.639,0.657,0.3 ...

  8. Jenkins在windows环境下的3种部署方式

    本文主要介绍Jenkins在windows环境下的3种部署方式: (1)官网下载jenkins.msi文件直接安装.jenkins官网地址:https:/jenkins.io/zh/ (2)jenki ...

  9. Date 对象 定时器

    日期对象 Date 概述:date是表示日期时间的对象,主要的方法是获取时间和设置日期时间. date声明 使用new Date声明 有4种方式 1.不设参数 是获取当前的本地时间 var date ...

  10. c++结对编程

    || |:--|:--| |Github项目|Github地址 |结对伙伴|伙伴地址1伙伴地址2 PSP表格 ||| |:--|:--|:--|:--| |PSP2.1|Personal Softwa ...