jsbarcode是一個不依賴任何庫/框架的條形碼生成庫,使用原生JavaScript寫成。
安裝依賴包
npm install jsbarcode --save
在使用頁面引入依賴包
import JsBarcode from ‘jsbarcode’
定義img標簽和id
format: “CODE39”,//選擇要使用的條形碼類型
width:3,//設置條之間的寬度
height:100,//高度
displayValue:true,//是否在條形碼下方顯示文字
text:“456”,//覆蓋顯示的文本
fontOptions:“bold italic”,//使文字加粗體或變斜體
font:“fantasy”,//設置文本的字體
textAlign:“l(fā)eft”,//設置文本的水平對齊方式
textPosition:“top”,//設置文本的垂直位置
textMargin:5,//設置條形碼和文本之間的間距
fontSize:15,//設置文本的大小
background:"#eee",//設置條形碼的背景
lineColor:"#2196f3",//設置條和文本的顏色。
margin:15//設置條形碼周圍的空白邊距
代碼:
JavaScript
JsBarcode("#imgbarcode", "1234567890", { format: "CODE128",//選擇要使用的條形碼類型 width:3,//設置條之間的寬度 height:100,//高度 displayValue:true,//是否在條形碼下方顯示文字 text:"456",//覆蓋顯示的文本 fontOptions:"bold italic",//使文字加粗體或變斜體 font:"fantasy",//設置文本的字體 textAlign:"left",//設置文本的水平對齊方式 textPosition:"top",//設置文本的垂直位置 textMargin:5,//設置條形碼和文本之間的間距 fontSize:15,//設置文本的大小 background:"#eee",//設置條形碼的背景 lineColor:"#2196f3",//設置條和文本的顏色。 margin:15//設置條形碼周圍的空白邊距});