Automatic backslash for Date Text Input React Native?

Question

Does anyone know how to create a text input that when you start typing in it, it automatically allows for a certain amount of digits with an automatic backslash separation for the numbers.

DD / MM / YYYY (I am not looking to use a date picker or library).

Answer 1

Try this react component:

https://github.com/benhurott/react-native-masked-text

INSTALL

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

USAGE

render() {
//the type is required but options is required only for some specific types.
  return (
    <TextInputMask
      refInput={(ref) => this.myDateText = ref;}
      type={'datetime'}
      options={{
        format: 'DD-MM-YYYY HH:mm:ss'
      }}
    />
  )
}

there's one type of mask that is suitable for you:

datetime: use datetime mask with moment format (default DD/MM/YYYY HH:mm:ss). It accepts options (see later in this doc).