React Calc Input

A React Component to make a calculator input behavior. Implementation of readable-number.js

DEMO

codepen

Install

Include react-calc-input.js to your web App file.

Usage

 
import React from 'react';
import ReactDOM from 'react-dom';
 
import CalcInput from './path/to/react-calc-input.js';
 
 
let App = React.createClass({
 
  getInitialState(){
    return {
      model: 1000
    }
  },
 
  render() {
    return (
      <div>
        <h1>Calc Input Component</h1>
        <p>Try to type 10,000 without comma</p>
 
        <CalcInput
          onChange={ this.modelChanged }
          initValue={ this.state.model }/>
 
        <p>Your State Get: { this.state.model } ({ typeof this.state.model })</p>
      </div>
    )
  },
 
  modelChanged(val){
    this.setState({
      model: val
    })
  }
 
})
 
 
ReactDOM.render(<App />, document.getElementById("app"))
 

Thank You for Making it become useful

Hopefully it can be useful for your next projects.

Let's talk about some projects

Just Contact Me At:

• Email: [e-mail]
• Skype Id: bosnaufal254
• twitter: @BosNaufal

License

MIT Copyright (c) 2016 - forever Naufal Rabbani