用vue-barcode生成条形码

使用背景

生成条形码

介绍

vue-barcode是JsBarcode的一个简单包装，所以相关配置属性需要在JsBarcode中查看。
JSBarcode官网

实现步骤

1. 安装vue-barcode插件

npm install vue-barcode

2. 在main.js中引入插件（这样页面中就可以直接使用，不用再import）

import VueBarcode from 'vue-barcode'; 
Vue.component('barcode', VueBarcode); 

3. 在HTML页面中使用

 <barcode :value="barcode" >条形码加载失败</barcode>

vue-qr配置属性

1. value：条形码内容(个人测试可以为数字、字母、键盘上常见的英文符号，但不能为汉字；内容越多长度越长，同样个数，字母比数字长)。如：:value=“QRCode1”
2. height：条形码高度，默认100。如：:height=“40”
3. width：条形码宽度，默认2。如：:width=“1”
4. margin：条形码外边距，默认10。如：:margin=“0”
5. font-size：条形码下方显示的文字大小，默认20。如：:font-size=“13”
6. text-position：条形码文字显示的位置，默认bottom。如：text-position=“top”

条形码属性详情跳转