>  기사  >  웹 프론트엔드  >  vue.js로 바코드를 생성하는 방법

vue.js로 바코드를 생성하는 방법

小云云
小云云원래의
2018-03-26 16:11:284350검색

이 기사는 주로 코드 형식으로 vue.js를 사용하여 바코드를 생성하는 방법을 공유합니다.

1. 플러그인을 다운로드하세요.

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

2. 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;}]
    }
  },

관련 권장사항:

php code128 바코드 생성 예시 공유

PHP 생성 바코드 예시

PHP를 사용하여 바코드 사진을 생성하는 방법

위 내용은 vue.js로 바코드를 생성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.