• Stars
    star
    215
  • Rank 177,842 (Top 4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 7 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Barcode generator for Vue.js

VueBarcode

Add barcodes to your Vue application super easily with VueBarcode! Try it out!

Supported barcode formats: CODE128 EAN EAN-13 EAN-8 EAN-5 EAN-2 UPC (A) CODE39 ITF-14 MSI Pharmacode Codabar

It is a light wrapper for the JsBarcode barcode library.

Install

npm install vue-barcode

Use

1. Add VueBarcode as a component

import VueBarcode from 'vue-barcode';

new Vue({
  components: {
    'barcode': VueBarcode
  }
})

2. Use it

<barcode value="value-to-render" format="barcode-format" ...more options>
  Show this if the rendering fails.
</barcode>

Example

Simple example with input binding. Try it out with this JsFiddle!

<div id="app">
  <input v-model="barcodeValue" /><br>
  <barcode v-bind:value="barcodeValue">
    Show this if the rendering fails.
  </barcode>
</div>
import VueBarcode from 'vue-barcode';

var app = new Vue({
  el: '#app',
  data: {
    barcodeValue: 'test',
  },
  components: {
    'barcode': VueBarcode
  }
})

Options

All options:

format width height text font-options font text-align text-position text-margin font-size background lineColor margin margin-top margin-bottom margin-left margin-right display-value ean128

For more information, see the JsBarcode documentation.