首先安装方法：（--save 参数会改变package.json 推荐使用 下次直接install就行了）

npm install --save qrcode

然后项目使用：

import QRCode from 'qrcode'

然后使用方法：

html 使用 -

<!-- index.html -->

<html>

  <body>

    <canvas id="canvas"></canvas>

    <script src="bundle.js"></script>

  </body>

</html>
// index.js -> bundle.js

var QRCode = require('qrcode')

var canvas = document.getElementById('canvas')

QRCode.toCanvas(canvas, '二维码内容xxxxxx', function (error) {

  if (error) console.error(error)

  console.log('success!');

})

NodeJS

var QRCode = require('qrcode')

QRCode.toDataURL('二维码内容xxxxxx!', function (err, url) { console.log(url) })

ES6/ES7

1.异步方式

import QRCode from 'qrcode'

// With promises

QRCode.toDataURL('二维码内容xxxxxx!') .then(url => { console.log(url) }) .catch(err => { console.error(err) })

2.同步方式

// With async/await
let text = 'xxxxxxxx';

const generateQR = async text => {

  try {

    console.log(await QRCode.toDataURL(text))

  } catch (err) {

    console.error(err)

  }

}


 






												


											
vue 生成 二维码 qrCode 插件 使用 方法的更多相关文章
	

    
								
  1. VUE 生成二维码插件
		
    原文:https://www.jianshu.com/p/496fd1cbee8d npm install qrcodejs2 --save 页面中引入 dom 结构 JS 方法编写 export d ...
    
		
    2. 
						
  2. js生成二维码  qrcode
		
    js生成二维码 QRcode npm 地址 1.安装qrcode //在项目文件夹中执行: npm install --save qrcode //或者,将其全局安装以使用qrcode命令行来保存qr ...
    
		
    3. 
						
  3. Java生成二维码QRCode.jar
		
    所需jar包:QRCode.jar:http://download.csdn.net/detail/xuxu198899223/7717745 package ewm; import java.awt ...
    
		
    4. 
						
  4. php生成二维码的插件phpqrcode
		
    参考网址: http://www.thinkphp.cn/topic/7749.html http://blog.csdn.net/stxyc/article/details/44650971 php ...
    
		
    5. 
						
  5. VUE 生成二维码(qrcodejs)
		
    1. 概述 1.1 引入二维码生成模块 npm install qrcodejs2 --save 注意:此处安装qrcodejs2,安装依赖后可在main方法中进行全局引用设置,也可单独某个页面中进行 ...
    
		
    6. 
						
  6. 【C#/WPF】.Net生成二维码QRCode的工具
		
    先马 http://qrcodenet.codeplex.com/ 使用该工具WPF生成二维码的简单例子: 前台XAML准备一个Image控件显示二维码. string qrcodeStr = &qu ...
    
		
    7. 
						
  7. vue 生成二维码+截图
		
    链接生成二维码 1.npm安装 npm install --save qrcodejs2 2.引入 import QRCode from 'qrcodejs2' 3.生成二维码 new QRCode( ...
    
		
    8. 
						
  8. 微信支付支付宝支付生成二维码的方法（php生成二维码的三种方法）
		
    如果图简单,可以用在线生成 http://pan.baidu.com/share/qrcode?w=150&h=150&url=http://www.xinzhenkj.com 最简单 ...
    
		
    9. 
						
  9. 使用PHP生成二维码的两种方法(带logo图像)
		
    一.利用Google API生成二维码 Google提供了较为完善的二维码生成接口,调用API接口很简单,以下是调用代码: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15  ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. JavaScript之HTML DOM Document 对象
			
    文档对象代表您的网页. 如果您希望访问 HTML 页面中的任何元素,那么您总是从访问 document 对象开始. 下面是一些如何使用 document 对象来访问和操作 HTML 的实例. 查找 H ...
    
			
    2. 
						
  2. myeclipse设置自动热部署
			
    MyEclipse中开发网站项目如何设置关联的Tomcat服务器热启动,即修改项目源代码时不需要每次都重启Tomcat 目前在做一个网站项目,使用MyEclipse+Tomcat,每次修改项目源代码时 ...
    
			
    3. 
						
  3. 【django后端分离】Django Rest Framework之认证系统之redis数据库的token认证（token过期时间）
			
    1:登录视图 redis_cli.py文件: import redis Pool= redis.ConnectionPool(host='localhost',port=6379,decode_res ...
    
			
    4. 
						
  4. 人物-旅行-潘德明-Info：《近代中国徒步环游世界第一人：潘德明 》
			
    ylbtech-人物-旅行-潘德明-Info:<近代中国徒步环游世界第一人:潘德明 > 1.返回顶部 1. 近代中国徒步环游世界第一人:潘德明 2016-10-12 18:01 “以世界为 ...
    
			
    5. 
						
  5. 【JZOJ4895】【NOIP2016提高A组集训第16场11.15】三部曲
			
    =v= 因为外来的入侵,国王决定在某些城市加派士兵.所有城市初始士兵数量为0.当城市 被加派了k名士兵时.城市i的所有子城市需要被加派k+1名士兵.这些子城市的所有子城市需要被加派k+2名士兵.以此类 ...
    
			
    6. 
						
  6. es安装遇到的问题
			
    问题1: es一闪即逝的问题?java的jdk环境变量没有配置好, JAVA_HOME没有配置好 必须在系统变量里面添加JAVA_HOME: C:\Program Files\Java\jre1.8. ...
    
			
    7. 
						
  7. Directx教程(24) 简单的光照模型(3)
			
    原文:Directx教程(24) 简单的光照模型(3)      在工程myTutorialD3D11_17中,我们重新定义我们的cube顶点法向,每个三角形面的顶点法向都是和这个三角形的面法向是一致 ...
    
			
    8. 
						
  8. JavaScript 开发的40个经典技巧
			
    首次为变量赋值时务必使用var关键字 变量没有声明而直接赋值得话,默认会作为一个新的全局变量,要尽量避免使用全局变量. 使用===取代== ==和!=操作符会在需要的情况下自动转换数据类型.但===和 ...
    
			
    9. 
						
  9. git 密钥
			
    为什么配置SHH呢?是为了方便我们剪切代码的时间免密码输入,特别方便如何配置呢? 首先安装git: 先到官网下载:官网下载git 然后安装后在桌面任意空白处右击,选择Git Base Here即可如下 ...
    
			
    10. 
						
  10. idea列编辑模式
			
    当我们想要选中一列时,在eclipse中alt+shit+a就可以选中一列了, 在网上很多的idea中列编辑的使用,但是对我的电脑却不管用,也不太清楚在哪里设置 最后无奈乱试一通,结果找到了 alt+ ...
    
			
    11.