React-Native cannot write first letter with noncapital

React NativeInput Field

React Native Problem Overview


I have some trouble with react-native. I have an Input component(like textfield) for user to enter his email address, but the thing is that, first letter always comes as capital letter default and it is impossible to make it non-capital. How can I change it like first letter can be small, as well? enter image description here

React Native Solutions


Solution 1 - React Native

TextInput has autoCapitalize to handle this.

`autoCapitalize enum('none', 'sentences', 'words', 'characters')`

For example try like this:

<TextInput
   placeholder=""
   placeholderTextColor='rgba(28,53,63, 1)'
   autoCapitalize='none'
   value='test'
/>

Solution 2 - React Native

Make sure that the property autoCorrect is false. This way it will not capitalize the first email character. Also setting the keyboardType to email-address shows the keyboard with an @ option accessible. That's how I would do:

          <TextInput
            textContentType='emailAddress'
            keyboardType='email-address'
            autoCapitalize='none'
            autoCorrect={false}
            autoCompleteType='email'
          />

Solution 3 - React Native

If you have an issue with TextInput to make all letters uppercase then you can use autoCapitalize = 'characters' and if you want only first characters to be uppercase then use autoCapitalize = 'words'. However, make sure you do not set the keyboard type property.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAli ZeynalovView Question on Stackoverflow
Solution 1 - React NativeSportView Answer on Stackoverflow
Solution 2 - React NativeMatheus CamaraView Answer on Stackoverflow
Solution 3 - React NativeVishal DhadukView Answer on Stackoverflow