When micro-interaction makes great UX

React Native sms text input validation
Photo by jamie452

When dealing with SMS validation code form, don't forget to add the autocomplete attribute with the value "one-time-code".

It allows iOS to autofill the input with the incoming SMS.

For iOS 12+ oneTimeCode can be used to indicate that a field can be auto-filled by a code arriving in an SMS.

import { TextInput } from 'react-native';

<TextInput
textContentType="oneTimeCode"
...
/>

One more thing.
If you learned something new, let me know andshare this article on Twitter.

Gravatar for dleuliette@gmail.com
David Leuliette is a freelance developer and trainer specializing in cross-platform application development. He helped dozens of companies to ship their MVP and automate their process.
Subscribe?

Be the first to receive insightful articles and actionable resources that help you to elevate your skills across every touch point.