Nagging Mario's Princess

    TypeScript icon, indicating that this package has built-in type declarations

    7.4.0 • Public • Published


    Input number control.

    NPM version dumi build status Test coverage Dependencies DevDependencies npm download bundle size





    import InputNumber from 'rc-input-number';
    export default () => <InputNumber defaultValue={10} />;


    npm install
    npm start


    online example:



    name type default description
    prefixCls string rc-input-number Specifies the class prefix
    min Number Specifies the minimum value
    placeholder string
    max Number Specifies the maximum value
    step Number or String 1 Specifies the legal number intervals
    precision Number Specifies the precision length of value
    disabled Boolean false Specifies that an InputNumber should be disabled
    focusOnUpDown Boolean true whether focus input when click up or down button
    required Boolean false Specifies that an InputNumber is required
    autoFocus Boolean false Specifies that an InputNumber should automatically get focus when the page loads
    readOnly Boolean false Specifies that an InputNumber is read only
    controls Boolean true Whether to enable the control buttons
    name String Specifies the name of an InputNumber
    id String Specifies the id of an InputNumber
    value Number Specifies the value of an InputNumber
    defaultValue Number Specifies the defaultValue of an InputNumber
    onChange Function Called when value of an InputNumber changed
    onBlur Function Called when user leaves an input field
    onPressEnter Function The callback function that is triggered when Enter key is pressed.
    onFocus Function Called when an element gets focus
    style Object root style. such as {width:100}
    upHandler React.Node custom the up step element
    downHandler React.Node custom the down step element
    formatter (value: number|string): displayValue: string Specifies the format of the value presented
    parser (displayValue: string) => value: number `input => input.replace(/[^\w\.-]*/g, '')` Specifies the value extracted from formatter
    pattern string Specifies a regex pattern to be added to the input number element - useful for forcing iOS to open the number pad instead of the normal keyboard (supply a regex of "\d*" to do this) or form validation
    decimalSeparator string Specifies the decimal separator
    inputMode string Specifies the inputmode of input

    Keyboard Navigation

    • When you hit the or key, the input value will be increased or decreased by step
    • With the Shift key (Shift+, Shift+), the input value will be changed by 10 * step
    • With the Ctrl or key (Ctrl+ or ⌘+ or Ctrl+ or ⌘+ ), the input value will be changed by 0.1 * step

    Test Case

    npm test
    npm run chrome-test


    npm run coverage

    open coverage/ dir


    rc-input-number is released under the MIT license.


    npm i rc-input-number

    DownloadsWeekly Downloads






    Unpacked Size

    71.7 kB

    Total Files


    Last publish


    • silentcloud
    • yesmeck
    • afc163
    • yiminghe
    • tsj1107
    • paranoidjk
    • zombiej