React Native - Masked Text

Всем привет! Сегодня я вам раскажу про библиотеку как react-native-masked-text. Это простой компонент с маскированным текстом (обычный текст и вводимый текст) для React-Native.

Установка

npm install react-native-masked-text --save

Использование

Маска: определяется шаблоном

• 9 - цифры.
• А - буквы.
• S - цифры и буквы.
• * - все корме пробелов.

Например: +9 (999) 999-99-99

import { TextInputMask } from 'react-native-masked-text'

//...

<TextInputMask
  type={'custom'}
  options={{
    mask: '999 AAA SSS ***'
  }}
  value={this.state.text}
  onChangeText={text => {
    this.setState({
      text: text
    })
  }}
  style={textInputStype}
/>