CODEWITHSUNDEEP
javascriptreactjsreact-nativeexpo
universe11
universe11

Reputation: 1053

React Native, why secureTextEntry not working?

Why is my secureTextEntry not working ? Here is my code:

export default function App() {
  const { t } = useTranslation();
  const [value, setValue] = useState('');
  return (
    <View style={s.container}>
      <Input value='' placeholder='Passwort' style={[InputStyles.normal, s.inputMargin]} />
      <Input value={value} onChangeText={(e) => setValue(e)} placeholder='E-Mail' style={InputStyles.normal_icon} icon={<AntDesign name="stepforward" size={24} color="black" />} multiline secureTextEntry={true} keyboardType='default' />
    </View>
  );
}

Upvotes: 2

Views: 1486

Answers (1)

Youssouf Oumar
Youssouf Oumar

Reputation: 45963

secureTextEntry does not work with multiline. Here is what React Native’s documentation says:

secureTextEntry

If true, the text input obscures the text entered so that sensitive text like passwords stay secure. The default value is false. Does not work with multiline={true}.

In order to have it working, remove multiline propriety, like so:

export default function App() {
  const { t } = useTranslation();
  const [value, setValue] = useState('');
  return (
    <View style={s.container}>
      <Input value='' placeholder='Passwort' style={[InputStyles.normal, s.inputMargin]} />
      <Input value={value} onChangeText={(e) => setValue(e)} placeholder='E-Mail' style={InputStyles.normal_icon} icon={<AntDesign name="stepforward" size={24} color="black" />} secureTextEntry={true} keyboardType='default' />
    </View>
  );
}

Upvotes: 2

Related Questions