支持平臺
- 支持H5、微信小程序、支付寶小程序、APP等
說明
組件對jsBarcode.js進(jìn)行二次封裝,使其能夠在uni-app中運(yùn)行。
支持生成的條碼格式
-
CODE128
- CODE128
- CODE128 A/B/C
-
EAN
- EAN-13
- EAN-8
- EAN-5
- EAN-2
- UPC (A)
- UPC (E)
- CODE39
-
ITF
- ITF
- ITF-14
-
MSI
- MSI10
- MSI11
- MSI1010
- MSI1110
- Pharmacode
- Codabar
開始使用
git clone https://github.com
使用方法
在 script 中引入組件
import tkiBarcode from "@/components/ls-barcode/ls-barcode.vue"
export default {
components: {lsBarcode}
}
在 template 中使用
<view>
<ls-barcode cid="EAN8" :loadGenerate="true" :options="options" :autoGenerate="true" format="EAN8" value="29012343" width="300" height="200"/>
</view>
屬性
| 屬性名 | 類型 | 默認(rèn)值 | 可選值 | 說明 |
|---|---|---|---|---|
| cid | String | ls-barcode-canvas | canvasId,頁面存在多個(gè)條形碼組件時(shí)需設(shè)置不同的ID | |
| unit | String | upx | px | 單位 |
| format | String | code128 | 條形碼類型(參照jsBarcode) | |
| value | String | FB19A1650-100S | 要生成的內(nèi)容 | |
| options | JSON | 參照jsBarcode | ||
| autoGenerate | Boolean | false | 監(jiān)聽value值變化自動重新生成條形碼 | |
| loadGenerate | Boolean | true | 組件初始化完成后自動生成條形碼,value需要有值 | |
| width | Number | 0 | 寬度(默認(rèn)0時(shí)為canvas畫布生成的條碼實(shí)際寬度) | |
| height | Number | 0 | 條碼高度(默認(rèn)0時(shí)為canvas畫布生成的條碼實(shí)際高度) |
方法
| 方法名 | 說明 |
|---|---|
| generateCode() | 生成條形碼 |
| clearCode() | 清空生成條形碼時(shí)生成的圖片數(shù)據(jù)(imagedata) |
| saveCode() | 保存條形碼到圖庫 |
小程序查看

gh_4adc37cd5625_258.jpg