I was going to look about how to disable it, but, I’m not sure what to even search for! I checked the TextInput docs, and didn’t see anything that stuck out as enabling/disabling this. I checked my specific input’s props, and didn’t see anything that stood out.
So, anyone know what this is referred to as? And more importantly, how to get rid of it?
It’s iOS’s way to let you store passwords and use your iphone access code, but, in this case the client doesn’t want it there.
This behavior was introduced in iOS 10, and it’s iOS’s way of providing credential auto-fill to users. It’s a convenience feature and it will appear whenever your application contains a secure text entry field (i.e. a password). To prevent this view from appearing, you’d need to tell iOS that this is a regular text input box and not a password.
When using React Native’s TextInput, you can set secureTextEntry to false. As it happens, this will prevent the password from being obscured during entry which is not what you may want to happen here.
On a native UITextInput, you can get around this by keeping secureTextEntry set to true, but setting the textContentType property to a blank string (or something other than a password type). This property is not exposed as a prop on the existing TextInput component however.
You have two options: write your own component that extends TextInput, and sets secureTextEntry to false, making sure your component can take care of obscuring the entry itself (by changing text entry to * while keeping track of the actual value being entered), or submitting a PR that exposes textContentType on TextInput.
Myself, I’d go for a third option: convince your client that removing this view is unnecessary. This is a convenience feature after all. This is my personal opinion, but websites and applications that break password managers incentivize bad password security policies. Instead of allowing the user to enter a long, secure password, this incentivizes users to use short and easy to brute force passwords.
I think this is what you are looking for: https://stackoverflow.com/questions/45378957/disable-ios-keyboard-suggestions-in-react-native
in short you need: <TextInput autoCorrect={false}/>
I’ll give this a look, I wouldn’t have guessed autoCorrect would work in this case.
