首先安装一下相关的插件 qrcode2

npm install --save qrcodejs2

　然后在需要画二维码的页面引入一下

import QRCode from 'qrcode2'

最后在methos里面定义一个方法去调用一下就行了

在对应的vue文件里定义一个二维码的容器

  <div id="qrcode" ref="qrcode"></div>

这样就大功告成了。

效果图如下

vue 画二维码的更多相关文章

  1. vue.js 二维码生成组件

    安装 通过NPM安装 npm install vue-qart --save 插件应用 将vue-qart引入你的应用 import VueQArt from 'vue-qart' new Vue({ ...

  2. VUE 生成二维码(qrcodejs)

    1. 概述 1.1 引入二维码生成模块 npm install qrcodejs2 --save 注意:此处安装qrcodejs2,安装依赖后可在main方法中进行全局引用设置,也可单独某个页面中进行 ...

  3. vue生成二维码插件qrcodejs2

    1.页面 <div id="qrCode" ref="qrCodeDiv"></div> 2.导入插件 import QRCode fr ...

  4. js通过codeURL画二维码

    一.函数封装 //生成微信二维码 function xyqrcode(options) { var settings = { dom:'', render: 'canvas', //生成二维码的格式还 ...

  5. VUE 生成二维码插件

    原文:https://www.jianshu.com/p/496fd1cbee8d npm install qrcodejs2 --save 页面中引入 dom 结构 JS 方法编写 export d ...

  6. vue条形码+二维码

    <template> <section style="height: 100vh;" class="bg"> <div class ...

  7. vue 生成 二维码 qrCode 插件 使用 方法

    首先安装方法:(--save 参数会改变package.json 推荐使用 下次直接install就行了) npm install --save qrcode 然后项目使用: import QRCod ...

  8. vue 生成二维码+截图

    链接生成二维码 1.npm安装 npm install --save qrcodejs2 2.引入 import QRCode from 'qrcodejs2' 3.生成二维码 new QRCode( ...

  9. vue 微信二维码扫码登录，附加 自定义样式

    大概流程:   先安装 微信 的登录, 然后 局部引入,局部注册,方法调用,存 token,跳转路由 npm 安装 npm install vue-wxlogin --save-dev 微信安装 微信 ...

随机推荐

  1. lua 与C通过c api传递table

    此文转自http://blog.csdn.net/perfect2011/article/details/19200511(感谢...) 首先了解下c++与lua之间的通信: 假设在一个lua文件中有 ...

  2. 搭建CARDBOARD+ANDROID+unity3d的VR开发环境

    一.下载最新unity3d(u3d官网) 二.下载最新cardboardsdkforunity(https://github.com/googlesamples/cardboard-unity) 三. ...

  3. bzoj 2142: 礼物【中国剩余定理+组合数学】

    参考:http://blog.csdn.net/wzq_qwq/article/details/46709471 首先推组合数,设sum为每个人礼物数的和,那么答案为 \[ ( C_{n}^{sum} ...

  4. 记一次线上环境的内存溢出（java.lang.OutOfMemoryError）

    事故背景 今天客户说风控项目有个别用户查询不到数据不是报错就是一直卡在那里,我就去那个接口看了下. 一看项目日志今天的都几个g了,平常也就几百兆吧,很明显出了问题. 请求接口后使用命令tail -f ...

  5. yii2 设置多个入口文件

    在web下希望加个core.php的后台入口,但因为权限问题,总是会跳转到index.php

  6. Android系统的启动流程

    手机启动后首先会通过执行BootLoader来启动Linux内核,BootLoader是所有嵌入式设备开机启动执行的第一行代码,linux内核在启动过程中会加载各种设备的驱动同时初始化数据结构,并且开 ...

  7. vijos P1629八 容斥原理

    https://vijos.org/p/1629 注意lcm要用LL 先给一个样例 1 2 1 10 思路.其实这题就是问,给定一堆数,要求不能整除其任意一个的数字有多少个. 容辞 + lcm dfs ...

  8. 求指教--hadoop2.4.1集群搭建及管理遇到的问题

    集群规划: 主机名 IP 安装的软件 运行的进程 hadooop 192.168.1.69 jdk.hadoop NameNode.DFSZKFailoverController(zkfc) hado ...

  9. 使用ImageMagick处理图片后导致图片变大的问题

    最新在使用ImageMagick处理图片时,发现有时经过处理的图片变大的问题. 例如原图为27K,经处理后的图片会变为77K. 先看测试代码: // imgtest.cpp : 定义控制台应用程序的入 ...

  10. [转]Business Model Canvas（商业模式画布）：创业公司做头脑风暴和可行性测试的一大利器

    本文转自:http://www.36kr.com/p/214438.html 本文来自First Round Review,他们准备的文章既讲故事,还同时向创业者提供可操作的建议,以助力打造优秀的公司 ...