How to autofocus next TextInput on react-native

Question

I\'m trying to create a passcode protected screen. The screen will uses 4 numeric input as the passcode.

The way I\'m doing this is create a TextInput Component and

Answer 1

we handled this style of screen with a different approach.

Rather than manage 4 individual TextInputs and handle the navigation of focus across each one (and then back again when the user deletes a character), we have a single TextInput on screen but is invisible (ie. 0px x 0px) wide which has the focus, maxLength and keyboard configuration, etc.

This TextInput takes input from the user but can't actually been seen, as each character is typed in we render the entered text as a series simple View/Text elements, styled much similar to your screen above.

This approach worked well for us with no need to manage what the 'next' or 'previous' TextInput to focus next to.