安装
yarn add jsbarcode
使用
// HTMLElement 承载条形码的元素 svg/canvas // text 显示在条形码下方的文字 // option 条形码的配置项 具体见【条形码的配置项】 JsBarcode(HTMLElement, text, option)
条形码的配置项
使用中的option
background: "#ffffff" // 背景色 displayValue: true // 是否显示条形码下面的文字 font: "monospace" // 字体 fontOptions: "" // 字体相关的配置 fontSize: 20 // 字体大小 默认20 format: "CODE128" // 条形码的种类 具体见 format height: 40 // 高度 lineColor: "#000000" // 条形码线条的颜色 margin: 8 // 条形码四种的间距 类似于div的padding marginBottom: 8 // 下边距 marginLeft: 8 // 左边距 marginRight: 8 // 右边距 marginTop: 8 // 上边距 text: undefined textAlign: "center" // 条形码下面的文字的对齐方式 textMargin: 2 textPosition: "bottom" // 条形码下面文字的位置
条形码的种类
条形码的配置项选项中的format
的值
CODE128 CODE128 (自动模式切换) CODE128 A/B/C (强制模式) EAN EAN-13 EAN-8 EAN-5 EAN-2 UPC (A) CODE39 ITF-14 MSI MSI10 MSI11 MSI1010 MSI1110 Pharmacode Codabar