小程序中生成二维码和条形码

41次阅读

共计 893 个字符,预计需要花费 3 分钟才能阅读完成。

使用 wxbarcode 模块可以很方便地生成二维码和条形码。
效果

安装
$ npm install wxbarcode
使用方法
import wxbarcode from ‘wxbarcode’

wxbarcode.barcode(‘barcode’, ‘1234567890123456789’, 680, 200);
wxbarcode.qrcode(‘qrcode’, ‘1234567890123456789’, 420, 420);
条形码
函数名:barcode
函数原型:barcode(id, code, width, height)
参数:

id: wxml 文件中的 Canvas ID
code: 用于生成条形码的字符串
width: 生成的条形码宽度,单位 rpx
height: 生成的条形码高度,单位 rpx

二维码
函数名:qrcode
函数原型:qrcode(id, code, width, height)
参数:

id: wxml 文件中的 Canvas ID
code: 用于生成二维码的字符串
width: 生成的二维码宽度,单位 rpx
height: 生成的二维码高度,单位 rpx

小程序案例
// 页面所在的 js 文件
import wxbarcode from ‘../../utils/qrcode/index.js’;
// …
wxbarcode.barcode(‘barcode’, res.data.voucher_info.closure_code, 680, 150);
wxbarcode.qrcode(‘qrcode’, res.data.voucher_info.closure_code, 340, 340);
// wxml 文件
<view class=’barcode’>
<canvas canvas-id=”barcode”></canvas>
</view>
<view class=’qrcode’>
<!– <image src=’/assets/images/qrcode.png’></image> –>
<canvas canvas-id=”qrcode”></canvas>
</view>
本地 wxbarcode 目录结构(从 github download 下来的目录结构)

正文完
 0