react-easy-mask

A simple masked input to React

Install

npm install --save react-easy-mask
or
yarn add react-easy-mask

Usage

import React from 'react';
import { MaskedNumber } from 'react-easy-mask'

const App = () => {
  return (
    <MaskedNumber mask="###.##.#" onChangeValue={console.log} />
  );
};

export default App;

Components

MaskedNumber

• Props

  Name	Type	Description	Example	Return
  mask	string	a mask pattern	###.##.#	-
  onChangeValue	function	change event		unmasked value
  ref	IMaskedNumberRef	input ref		-

• Ref

  Name	Type	Description	Return
  getValue	function	gets input value	string
  setValue	function	sets input value	-
  focus	function	sets focus on the input	-
  blur	function	removes focus on the input	-

MaskedCurrency

• Props

  Name	Type	Description	Example	Return
  locale	string	BCP 47 tag	pt-BR	-
  currency	string	SO 4217 code	BRL	-
  onChangeValue	function	change event		number
  max	number	max value		-
  ref	IMaskedCurrencyRef	input ref		-

• Ref

  Name	Type	Description	Return
  getValue	function	gets input value	number
  setValue	function	sets input value	-
  focus	function	sets focus on the input	-
  blur	function	removes focus on the input	-

License

MIT © Aldriê Mizobuti