react-input-mask-persian v0.7.5
react-input-mask
Yet another React component for input masking with attention to small usability details with cursor position, copy-paste, etc.
Demo
Install
npm install react-input-mask --save
Properties
mask
: string
Mask string. Format characters are: 9: 0-9۰-۹ a: A-Z, a-z *: A-Z, a-z, 0-9۰-۹
Any character can be escaped with backslash, which usually will appear as double backslash in JS strings. For example, German phone mask with unremoveable prefix +49 will look like mask="+4\9 99 999 99" or mask={"+4\\9 99 999 99"}
maskChar
: string
Character to cover unfilled editable parts of mask. Default character is "_". If set to null, unfilled parts will be empty, like in ordinary input.
formatChars
: object
Defines format characters with characters as keys and corresponding RegExp string as values. Default ones:
{
"9": "[0-9]",
"a": "[A-Za-z]",
"*": "[A-Za-z0-9]"
}
alwaysShowMask
: boolean
Show mask even in empty input without focus.
Example
var PhoneInput = React.createClass({
render: function() {
return <InputElement {...this.props} mask="+4\9 99 999 99" maskChar=" "/>;
}
});
Known issues
Screen keyboard backspace may not work in Android 4.x browser due to broken input events.
Thanks
Thanks to BrowserStack for help with testing on real devices
8 years ago