时间戳

首页 > 解决方案 > React Native（Expo）TextInput：选择Android提供的建议时样式发生变化

react-native - React Native（Expo）TextInput：选择Android提供的建议时样式发生变化

问题描述

自 2 天以来一直在寻找这个问题的解决方案，而互联网并没有为我提供我生命中的第一次解决方案，所以这是我在 StackOverflow 上的第一篇文章 :)

因此，我正在使用 Expo (3.4.1) 构建一个 react-native (0.59.8) 应用程序，并使用 Android 9.1 进行测试。

我有一个看起来像这样的电子邮件 TextInput：

const style = {
  backgroundColor: '#181818',
  color: '#fafafa',
  width: '100%',
  borderColor: $primary,
  borderWidth: 1,
  borderRadius: 4,
  marginBottom: 16,
  padding: 8,
};

return (
  <TextInput
    placeholder="Email"
    keyboardType="email-address"
    autoCompleteType="email"
    style={style.input}
    autoCorrect={false}
    selectionColor={$primary}
  />
);

TextInput 首先按预期显示，当我手动填写（键入我的电子邮件地址）时没有问题。

但是，当我选择一个 Android 建议时，TextInput 样式会发生变化（颜色变为浅黄色，backgroundColor 变为黄色/绿色，borderColor 变为橙色），这有点难看：/。

看起来行为与-webkit-text-fill-color标准 CSS 中的行为相同，但在 RN 中找不到对应的行为。

谢谢你的帮助 ：）

标签： react-nativereact-native-androidreact-native-textinputreact-native-stylesheet

解决方案

https://developer.android.com/guide/topics/text/autofill-optimize#highlighted

您可以使用 android xml 文件自定义样式。有关更多详细信息，请参见此处。

推荐阅读