jsBarcode 官网
一、安装
script 引入
<script src="JsBarcode.all.min.js"></script>
地址:https://cdn.jsdelivr.net/npm/[email protected]/dist/JsBarcode.all.min.js
也可以进官网查看地址。
npm方式
安装:
npm install jsbarcode --save
页面引入:
import JsBarcode from"jsbarcode";
二、使用
HTML部分加入svg容器
<svgid="barcode"></svg>
JS 代码部分
JsBarcode("#barcode","Hi world!");
三、结果
参数设置(options)
option默认值类型说明format“auto” (CODE128)String条形码的类型width2Number每个条条的宽度,注意这里不是指整个条形码的宽度height100Number整个条形码的宽度displayValuetrueBoolean是否显示条形码下面的文字fontOptions“”String设置条形码文本的粗体和斜体样式 bold / italic / bold italicfont“monospace”String设置条形码显示文本的字体textAlign“center”String条形码文本的水平对齐方式,和css中的类似: left / center / righttextPosition“bottom”String条形码文本的位置 bottom / toptextMargin2Number条形码文本 和 条形码之间的间隙大小fontSize20Number设置条形码文本的字体大小background“#ffffff”String (CSS color)整个条形码容器的背景颜色lineColor“#000000”String (CSS color)条形码和文本的颜色margin10Number整个条形码的外面距marginTopundefinedNumber整个条形码的上边距marginBottomundefinedNumber整个条形码的下边距marginLeftundefinedNumber整个条形码的左边距marginRightundefinedNumber整个条形码的右边距validfunction(valid){}Function执行完条形码的一个回调函数,正确true 错误false
options 使用方法
let options ={fontSize:12,background:"#cccccc"};JsBarcode("#barcode","Hi world!", options);
版权归原作者 最凶残的小海豹 所有, 如有侵权,请联系我们删除。