本文主要是介绍插件:qrcode的使用，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
源文档： qrcode文档
安装
npm install --save qrcodeTypeScript用户：如果您使用@types/qrcode，则需要在数据段上方添加//@ts ignore，因为它需要data:string。
用法
用法：qrcode〔options〕＜input string＞二维码选项：
-v、 --qversion二维码符号版本（1-40）[编号]
-e、 --error纠错级别[选项：“L”、“M”、“Q”、“H”]
-m、 --掩码掩码模式（0-7）[数字]渲染器选项：
-t、 --type输出类型[选项：“png”、“svg”、”utf8“]
-w、 --width图像宽度（px）[数字]
-s、 --比例比例因子[数字]
-q、 --qzone安静区域大小[number]
-l、 --lightcolor Light RGBA十六进制颜色
-d、 --深色深色RGBA十六进制颜色
--small将较小的二维码输出到终端[布尔值]选项：
-o、 --输出输出文件
-h、 --help显示帮助[boolean]
--version显示版本号[布尔值]示例：
qrcode“some text”在终端窗口中绘制
qrcode-o out.png“some text”另存为png图像
qrcode-d F00-o out.png“some text”使用红色作为前景色如果未指定，则根据文件扩展名推测输出类型。可识别的扩展名有png、svg和txt。
API
浏览器端api
1.create() 创建二维码符号并返回一个二维码对象。
create(text, [options])
text: 要编码的文本或描述分段的对象列表。
options:
1.1 returns : object类型
// QRCode object
{modules, // 具有模块数据的位矩阵类version, // 二维码版本errorCorrectionLevel, // 纠错级别maskPattern, // 计算的遮罩图案segments // 生成的分段
}2.toCanvas() 在画布上绘制二维码符号。
toCanvas（canvasElement，text，[options]，[cb（error）]）和 toCanvas(text, [options], [cb(error, canvas)]) ,如果省略了canvasElement，则返回一个新的画布。
2.1canvasElement: 画布绘制二维码绑定的dom元素。
2.2text: 要编码的文本或描述分段的对象列表。
2.3options:
2.3.1 cb:绘制完成时调用的回调函数
QRCode.toCanvas('text', { errorCorrectionLevel: 'H' }, function (err, canvas) {if (err) throw errvar container = document.getElementById('container')container.appendChild(canvas)
})节点qrcode可以通过Browserify和Webpack等模块捆绑器在浏览器中使用，也可以通过将预编译的捆绑包包含在构建/文件夹中来使用。
<!-- index.html -->
<html><body><canvas id="canvas"></canvas><script src="bundle.js"></script></body>
</html>// index.js -> bundle.js
const QRCode = require('qrcode')
const canvas = document.getElementById('canvas')QRCode.toCanvas(canvas, 'sample text', function (error) {if (error) console.error(error)console.log('success!');
})ES6/ES7中使用(Promises和Async/Await可以用来代替回调函数)
import QRCode from 'qrcode'// With promises
QRCode.toDataURL('I am a pony!').then(url => {console.log(url)}).catch(err => {console.error(err)})// With async/await
const generateQR = async text => {try {console.log(await QRCode.toDataURL(text))} catch (err) {console.error(err)}
}二进制数据
QR码可以保存基于任意字节的二进制数据。如果您试图通过首先将数据转换为JavaScript字符串来创建二进制QR码，它将无法正确编码，因为字符串编码会添加额外的字节。相反，您必须传递一个Uint8ClampedArray或兼容的数组，或一个Node Buffer，如下所示：
// Regular array example
// WARNING: Element values will be clamped to 0-255 even if your data contains higher values.
const QRCode = require('qrcode')
QRCode.toFile('foo.png',[{ data: [253,254,255], mode: 'byte' }],...options...,...callback...
)// Uint8ClampedArray example
const QRCode = require('qrcode')QRCode.toFile('foo.png',[{ data: new Uint8ClampedArray([253,254,255]), mode: 'byte' }],...options...,...callback...
)// Node Buffer example
// WARNING: Element values will be clamped to 0-255 even if your data contains higher values.
const QRCode = require('qrcode')QRCode.toFile('foo.png',[{ data: Buffer.from([253,254,255]), mode: 'byte' }],...options...,...callback...
)3.toDataURL() 返回包含二维码图像表示形式的数据URI。如果提供，canvasElement将被用作画布来生成数据URI。
toDataURL（文本，[选项]，[cb（错误，url）]）和 toDataURL（canvasElement，text，[options]，[cb（error，url）]）。
3.1 canvasElement: 画布绘制二维码绑定的dom元素。
3.2 text: 要编码的文本或描述分段的对象列表。
3.3 options:
3.3.1 type
类型: String
可能的值有：images/png、images/jpeg、images/web。
3.3.2 rendererOpts.quality:
类型: Number
一个介于0和1之间的数字，如果请求的类型是image/jpeg或image/web，则表示图像质量。
3.3.3 cb 绘制完成时调用的回调函数
const opts = {errorCorrectionLevel: 'H',type: 'image/jpeg',quality: 0.3,margin: 1,color: {dark:"#010599FF",light:"#FFBF60FF"}
}QRCode.toDataURL('text', opts, function (err, url) {if (err) throw errvar img = document.getElementById('image')img.src = url
})4.toString()
toString（text，[options]，[cb（error，string）]）返回QR代码的字符串表示形式。
4.1 text: 要编码的文本或描述分段的对象列表。
4.2 options:
4.2.1 type
类型： String
可能的值有：terminal、utf8和svg。
4.2.2 cb 绘制完成时调用的回调函数
QRCode.toString('http://www.google.com', function (err, string) {if (err) throw errconsole.log(string)
})这篇关于插件:qrcode的使用的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
