https://github.com/lindell/vue-barcode

Barcode generator for Vue.js
https://github.com/lindell/vue-barcode

barcode vue vue2 vuejs2

Last synced: 3 days ago
JSON representation

Barcode generator for Vue.js

• Host: GitHub
• URL: https://github.com/lindell/vue-barcode
• Owner: lindell
• License: mit
• Created: 2017-03-14T16:49:16.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-09-28T16:50:38.000Z (about 4 years ago)
• Last Synced: 2024-10-24T21:23:37.109Z (16 days ago)
• Topics: barcode, vue, vue2, vuejs2
• Language: JavaScript
• Homepage:
• Size: 14.6 KB
• Stars: 220
• Watchers: 7
• Forks: 26
• Open Issues: 15
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# VueBarcode

Add barcodes to your Vue application super easily with VueBarcode! [Try it out!](http://jsfiddle.net/hfgan035/13/)

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](https://github.com/lindell/JsBarcode) barcode library.

## Install

````

npm install vue-barcode

````

## Use

#### 1. Add VueBarcode as a component

````javascript

import VueBarcode from 'vue-barcode';

new Vue({

  components: {

    'barcode': VueBarcode

  }

})

````

#### 2. Use it

````html

  Show this if the rendering fails.

````

## Example

Simple example with input binding. [Try it out with this JsFiddle!](http://jsfiddle.net/hfgan035/4/)

````html



  


  

    Show this if the rendering fails.

  



````


````javascript

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](https://github.com/lindell/JsBarcode/wiki/Options).