|
| 1 | +[](https://badge.fury.io/js/react-barcode-reader) |
| 2 | + |
| 3 | +## Introduction |
| 4 | +A [React](https://facebook.github.io/react/) component for reading barcode an QR codes from devices that are represent as keyboard to the system. |
| 5 | + |
| 6 | +## Demo |
| 7 | +[kybarg.github.io/react-barcode-reader/](https://kybarg.github.io/react-barcode-reader/) |
| 8 | + |
| 9 | +## Install |
| 10 | +`npm install --save react-barcode-reader` |
| 11 | + |
| 12 | +## Example |
| 13 | + |
| 14 | +```js |
| 15 | +import React, { Component } from 'react' |
| 16 | +import BarcodeReader from 'react-barcode-reader' |
| 17 | + |
| 18 | +class Test extends Component { |
| 19 | + constructor(props){ |
| 20 | + super(props) |
| 21 | + this.state = { |
| 22 | + result: 'No result', |
| 23 | + } |
| 24 | + |
| 25 | + this.handleScan = this.handleScan.bind(this) |
| 26 | + } |
| 27 | + handleScan(data){ |
| 28 | + this.setState({ |
| 29 | + result: data, |
| 30 | + }) |
| 31 | + } |
| 32 | + handleError(err){ |
| 33 | + console.error(err) |
| 34 | + } |
| 35 | + render(){ |
| 36 | + |
| 37 | + return( |
| 38 | + <div> |
| 39 | + <BarcodeReader |
| 40 | + onError={this.handleError} |
| 41 | + onScan={this.handleScan} |
| 42 | + /> |
| 43 | + <p>{this.state.result}</p> |
| 44 | + </div> |
| 45 | + ) |
| 46 | + } |
| 47 | +} |
| 48 | +``` |
| 49 | + |
| 50 | +## Props |
| 51 | +| Prop | Type | Default Value | Description | |
| 52 | +|---|---|---|---|---| |
| 53 | +| onScan | func | | Callback after detection of a successfull scanning (scanned string in parameter) | |
| 54 | +| onError | func | | Callback after detection of a unsuccessfull scanning (scanned string in parameter) | |
| 55 | +| HonReceive | func | | Callback after receiving and processing a char (scanned char in parameter) |
| 56 | +| onKeyDetect | func | | Callback after detecting a keyDown (key char in parameter) - in contrast to onReceive, this fires for non-character keys like tab, arrows, etc. too! |
| 57 | +| timeBeforeScanTest | number | 100 | Wait duration (ms) after keypress event to check if scanning is finished |
| 58 | +| avgTimeByChar | number | 30 | Average time (ms) between 2 chars. Used to do difference between keyboard typing and scanning |
| 59 | +| minLength | number | 6 | Minimum length for a scanning |
| 60 | +| endChar | [number] | [9, 13] | Chars to remove and means end of scanning |
| 61 | +| startChar | [number] | [] | Chars to remove and means start of scanning |
| 62 | +| scanButtonKeyCode | number | | Key code of the scanner hardware button (if the scanner button a acts as a key itself) |
| 63 | +| scanButtonLongPressThreshold | number | 3 | How many times the hardware button should issue a pressed event before a barcode is read to detect a longpress |
| 64 | +| onScanButtonLongPressed | func | | Callback after detection of a successfull scan while the scan button was pressed and held down |
| 65 | +| stopPropagation | bool | false | Stop immediate propagation on keypress event |
| 66 | +| preventDefault | bool | false | Prevent default action on keypress event |
| 67 | +| testCode | string | | Test string for simulating |
| 68 | + |
| 69 | +## Dev |
| 70 | + |
| 71 | +### Install dependencies |
| 72 | +`npm install` |
| 73 | + |
| 74 | +### Build |
| 75 | +`npm run build` |
| 76 | + |
| 77 | +### Demo |
| 78 | +`npm run storybook` |
| 79 | + |
| 80 | +### Test |
| 81 | +`npm test` |
| 82 | + |
| 83 | +### Linting |
| 84 | +`npm run lint` |
| 85 | + |
| 86 | +## License |
| 87 | +The MIT License (MIT) |
| 88 | + |
| 89 | +Copyright (c) 2017 Thomas Billiet |
| 90 | + |
| 91 | +Permission is hereby granted, free of charge, to any person obtaining a copy |
| 92 | +of this software and associated documentation files (the "Software"), to deal |
| 93 | +in the Software without restriction, including without limitation the rights |
| 94 | +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
| 95 | +copies of the Software, and to permit persons to whom the Software is |
| 96 | +furnished to do so, subject to the following conditions: |
| 97 | + |
| 98 | +The above copyright notice and this permission notice shall be included in all |
| 99 | +copies or substantial portions of the Software. |
| 100 | + |
| 101 | +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
| 102 | +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
| 103 | +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
| 104 | +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
| 105 | +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
| 106 | +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE |
| 107 | +SOFTWARE. |
0 commit comments