react-input-numeric-hook v1.0.2

React数值输入框

npm i react-input-numeric-hook

该包以commonjs对外提供接口。

使用方法

import { useInputNumeric } from 'react-input-numeric-hook';

function InputNumber(props) {
  const { value, onChange } = props;
  const { numeric, onTextChange, onCursorChange } = useInputNumeric({
    value,
    onChange,
    setCursor(cursor) {
      // TODO
    },
    getCursor() {
      // TODO
    },
  });

  return <Input value={numeric} onChange={onTextChange} onFocus={onCursorChange} onClick={onCursorChange} />;
}

具体参数和返回接口可阅读 index.d.ts.

web

web中可以使用下面的代码快捷实现一个数值输入框。

import { useInputNumeric } from 'react-input-numeric-hook/web';

function InputNumber(props) {
  const attrs = useInputNumeric(props);
  return <input type="text" {...attrs} />;
}

reactnative

reactnative中可以使用下面的代码快捷实现一个数值输入框。

import { useInputNumeric } from 'react-input-numeric-hook/native';
import { TextInput } from 'react-native';

function InputNumber(props) {
  const attrs = useInputNumeric(props);
  return <TextInput {...attrs} />;
}