1.0.2-b • Published 7 years ago
react-input-format v1.0.2-b
React input format
Simple react component for formatted inputs. Flexible enough to add your own formatters.
Install
npm install react-input-format
Example
import React from 'react';
import InputFormat from 'react-input-format';
export default class MyComponent extends React.Component {
render () {
return (
<InputFormat format="thousand-separated" onChange={e => {console.log(e)}} />
)
}
}
Props
format
- String - The formatter desired (required)defaultValue
- NumberformatterProps
- ObjectonChange
- Function - Returns avalue
andoriginalEvent
Formatters
thousand-separated
Formats numbers larger than a thousand with a comma for easier reading. Currently hardcoded to a comma format, with the dot indicating decimals. Custom separators will come, I promise.
percentage
Formats number as a percentage. Specific formatterProps
include:
decimals
To set default number of decimalsfactor
Eg. Set to 0.01, and a 100% value will be returned as 1. A 22% value is 0.22.
Your custom formatter
It's relatively easy to write your own formatter. Fork this project and copy one of the formatters in src/formatters and format away. When done, create a PR :D