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

最新推荐文章于 2024-04-07 14:00:28 发布

baao7274

最新推荐文章于 2024-04-07 14:00:28 发布

阅读量254

点赞数

文章标签： javascript json ViewUI

原文链接：http://www.cnblogs.com/Human-nature/p/10952519.html

版权

首先安装方法：（--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)
  }
}

转载于:https://www.cnblogs.com/Human-nature/p/10952519.html

baao7274

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue 生成二维码 qrCode 插件使用方法

首先安装方法：（--save 参数会改变package.json 推荐使用下次直接install就行了）npm install --save qrcode然后项目使用：import QRCode from 'qrcode' 然后使用方法：html 使用 -<...
复制链接

扫一扫