react-native：如何在 Android 设备上的 TextInput 组件中输入文本时删除下划线？

Question

I want to remove underline while typing text inside the react native TextInput component on android device. Text underline removes as soon as press enter or spacebar. It's just showing until we type that word.

I have tried these options below:

• autoCorrect={false}
• spellCheck={false}
• underlineColorAndroid="transparent"
• underlineColorAndroid="rgba(0,0,0,0)"

<TextInput
  autoCorrect={false}
  spellCheck={false}
  underlineColorAndroid="transparent"
  placeholder="Username"
  style={styles.textInput}
/>

And my styles

 const styles = StyleSheet.create({
  textInput: {
    fontSize: 18,
    fontFamily: Platform.OS === "android" ? "Roboto" : "Avenir",
    color: colors.dark,
  }
 })

This is probably not a feature of keyboard app because in other app it is not showing the underline.

image showing text input with underline text

Answer 1

It's normal react-native behavior, but you can bypass it with:

keyboardType="visible-password"

Only caveat is that this disables multiline.

Answer 2

只需简单地使用：

underlineColorAndroid="transparent"