Have ideas to improve npm?Join in the discussion! »

    react-numeric

    1.0.0 • Public • Published

    react-numeric

    npm npm

    A react component for formatted number form fields

    react-numeric is a wrapper component for autonumeric.

    Installition

    yarn add react-numeric
    # or 
    npm install react-numeric --save

    Usage

    import ReactNumeric from 'react-numeric';
     
    export function USDMoneyInput(props){
      const { value } = props; // number typed
      return (
        <ReactNumeric
          value={value}
          currencySymbol="$"
          minimumValue="0"
          decimalCharacter="."
          digitGroupSeparator=""
          onChange={(event, value)=>{
            console.log(event.target.value); // '1,234.5 $'
            console.log(value); // 1234.5
          }}
        />
      );
    }
     
    // You can use predefinedOptions
    import { predefinedOptions } from 'react-numeric';
     
    export function PossitiveUSDMoneyInput(props){
      const { value } = props; // number typed
      return (
        <ReactNumeric
          value={value}
          preDefined={predefinedOptions.dollarPos}
          onChange={(e, value)=> this.setState({ value })}
        />
      );
    }
     
    // if you want to store value as string typed
    export function NumberInput(props){
      const { value } = props; // string typed
      return (
        <ReactNumeric
          value={value}
          outputFormat="string"
          onChange={(e, value)=> this.setState({ value })}
        />
      );
    }

    Install

    npm i react-numeric

    DownloadsWeekly Downloads

    1,120

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    33.1 kB

    Total Files

    15

    Last publish

    Collaborators

    • avatar