小程序 生成条形码barcode.js

Posted 2022-04-25 muzs

1、下载barcode.js，新建一个文件wxbarcode.js用于计算条形码的宽高，以自适应不同手机屏显示

var barcode = require(‘./barcode‘); 

function convert_length(length) 
    return Math.round(wx.getSystemInfoSync().windowWidth * length / 750);


function barc(id, code, width, height) 
    barcode.code128(wx.createCanvasContext(id), code, convert_length(width), convert_length(height)) //参数1：页面接收生成条形码的容器 参数2：需要生成条形码的code 参数3：条形码的宽度 参数4：条形码的高度

 

module.exports = 
    barcode: barc

2、在需要使用的页面引入wxbarcode.js

const wxbarcode = require(‘wxbarcode.js‘);

//在拿到生成条形码的id后调用
 wxbarcode.barcode(‘barcode‘, code, 490, 80); //注意在wxml中设置一个如代码id为barcode的wxml容器

3、注意：

由于barcode.js的条形码的位置实际是通过获取页面相关元素的高度后定位而得到的位置，

所以如果在条形码元素的前面，有通过手动计算后得到高度的元素，那么条形码的位置可能会出现偏差。

所以条形码前面的图片元素不能使用mode=‘widthFix‘属性，元素不能通过计算得到高度，最好通过wxss设置固定高。