I have a custom ponent like below

<Input
  value={value}
  style={styles.input}
  secureTextEntry={passwordInput && !this.state.showPassword}
  onChangeText={onChangeText}
  autoCapitalize={disableAutoCapitalize ? 'none' : 'words'}
  autoCorrect={!disableAutoCorrect}
  editable={!notEditable}
/>

But when I try to set autoCapitalize to words it's not working, why?

<InputField
  disableAutoCapitalize={false}
  disableAutoCorrect
/>

I have a custom ponent like below

<Input
  value={value}
  style={styles.input}
  secureTextEntry={passwordInput && !this.state.showPassword}
  onChangeText={onChangeText}
  autoCapitalize={disableAutoCapitalize ? 'none' : 'words'}
  autoCorrect={!disableAutoCorrect}
  editable={!notEditable}
/>

But when I try to set autoCapitalize to words it's not working, why?

<InputField
  disableAutoCapitalize={false}
  disableAutoCorrect
/>

• javascript
• reactjs

3 Answers 3

disableAutoCapitalize is passed in as a prop I assume. You should use this.props.disableAutoCapitalize.

<Input
  value={value}
  style={styles.input}
  secureTextEntry={passwordInput && !this.state.showPassword}
  onChangeText={onChangeText}
  autoCapitalize={this.props.disableAutoCapitalize ? 'none' : 'words'}
  autoCorrect={!disableAutoCorrect}
  editable={!notEditable}
/>

It is working on iOS but not on Android(Galaxy S9), it looks like a react native bug.

Its a react native bug that is fixed after 0.61.5. But in short, remove keyboardType, if possible, then autoCapitaliz will work for you

See these issues for a backstory: https://github./facebook/react-native/issues/27510 https://github./facebook/react-native/issues/8932