How to generate barcode with vue.js

This article mainly shares with you the method of generating barcodes with vue.js, mainly in the form of code. I hope it can help you.

1. Download the plug-in

npm install @xkeshi/vue-barcode //下载条形码插件

2. Introduce the plug-in into main.js

import VueBarcode from '@xkeshi/vue-barcode'; //导入条形码插件ue.component('barcode', VueBarcode);  //声明条形码组件

<p class="printOrder" v-for="(v,k) in list">
   <barcode :value="v.barcodes" :options="barcode_option" tag="svg" ></barcode>
</p>//注意，要答应的内容不能出现汉字，否则显示不出来，可以有空格特殊字符等data(){    return{
      barcode_option:{
        displayValue: true, //是否默认显示条形码数据
        //textPosition  :&#39;top&#39;, //条形码数据显示的位置
        background: &#39;#fff&#39;, //条形码背景颜色
        valid: function (valid) {
          console.log(valid)
        },
        width:&#39;1px&#39;,
        height: &#39;55px&#39;,
        fontSize: &#39;22px&#39; //字体大小
    },
      list:[{barcodes:&#39;A01-01-01&#39;},{barcodes:&#39;A01-01-01&#39;}]
    }
  },

Related recommendations:

php generate code128 barcode example Share

PHP generated barcode example

How to use PHP to generate barcode images

The above is the detailed content of How to generate barcode with vue.js. For more information, please follow other related articles on the PHP Chinese website!