https://github.com/vovanr/react-decinc
React decrement/increment input component
https://github.com/vovanr/react-decinc
react react-component
Last synced: 3 months ago
JSON representation
React decrement/increment input component
- Host: GitHub
- URL: https://github.com/vovanr/react-decinc
- Owner: VovanR
- License: mit
- Created: 2016-04-07T15:15:55.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2016-11-23T12:39:18.000Z (over 9 years ago)
- Last Synced: 2025-02-27T03:47:56.897Z (over 1 year ago)
- Topics: react, react-component
- Language: JavaScript
- Homepage: https://vovanr.github.io/react-decinc
- Size: 55.7 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# react-decinc
[![Commitizen friendly][commitizen-image]][commitizen-url]
[![XO code style][codestyle-image]][codestyle-url]
[![NPM version][npm-image]][npm-url]
[![Build Status][travis-image]][travis-url]
[![Dependency Status][depstat-image]][depstat-url]
[![DevDependency Status][depstat-dev-image]][depstat-dev-url]
> React decrement/increment input component
Demo: [vovanr.github.io/react-decinc][demo]
## Install
```
npm install --save react-decinc
```
## Usage
See: [example](example/app.jsx)
```js
class App extends React.Component {
constructor() {
super();
this.state = {
count: 33,
gramm: 0.15
};
this.handleChangeCount = this.handleChangeCount.bind(this);
this.handleChangeGramm = this.handleChangeGramm.bind(this);
}
handleChangeCount(value) {
this.setState({count: value});
}
handleChangeGramm(value) {
this.setState({gramm: value});
}
render() {
return (
{'Count: '}
{'Gramm: '}
);
}
}
ReactDOM.render(, document.getElementById('app'));
```
## Api
```js
DecInc.propTypes = {
value: React.PropTypes.number,
min: React.PropTypes.number,
max: React.PropTypes.number,
step: React.PropTypes.number,
disabled: React.PropTypes.bool,
className: React.PropTypes.string,
onChange: React.PropTypes.func
};
DecInc.defaultProps = {
step: 1,
disabled: false
};
```
## License
MIT © [Vladimir Rodkin](https://github.com/VovanR)
[demo]: http://vovanr.github.io/react-decinc
[commitizen-url]: http://commitizen.github.io/cz-cli/
[commitizen-image]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg?style=flat-square
[codestyle-url]: https://github.com/sindresorhus/xo
[codestyle-image]: https://img.shields.io/badge/code_style-XO-5ed9c7.svg?style=flat-square
[npm-url]: https://npmjs.org/package/react-decinc
[npm-image]: https://img.shields.io/npm/v/react-decinc.svg?style=flat-square
[travis-url]: https://travis-ci.org/VovanR/react-decinc
[travis-image]: https://img.shields.io/travis/VovanR/react-decinc.svg?style=flat-square
[depstat-url]: https://david-dm.org/VovanR/react-decinc
[depstat-image]: https://david-dm.org/VovanR/react-decinc.svg?style=flat-square
[depstat-dev-url]: https://david-dm.org/VovanR/react-decinc
[depstat-dev-image]: https://david-dm.org/VovanR/react-decinc/dev-status.svg?style=flat-square