首頁 > web前端 > js教程 > vue.js產生條碼的方法

vue.js產生條碼的方法

小云云
發布: 2018-03-26 16:11:28
原創
4407 人瀏覽過

本文主要和大家分享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中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板