文本输入水平滚动

Question

我有两个输入文本。第一个是电子邮件，当我写的文本多于此输入的宽度时，问题就来了，其余文本看不到。正常行为是水平滚动以查看其余文本，对吗？

我不知道我是否遗漏了什么，但它不起作用。

示例代码如下：rnplay.org

编辑： 这是我想要的效果，这是来自 UI 官方 React Native repo 的资源管理器示例：

谢谢！

Answer 1

我把一个 hacky 东西放在一起 here，基本上是将 TextInput 包装在水平 ScrollView 中：

https://rnplay.org/apps/q7M2Pg

<View style={{ backgroundColor: 'white', overflow: 'hidden' }}>
  <ScrollView horizontal={true} style={{ marginBottom:-7 }}>                        
     <TextInput
        style={ [styles.loginFormInput, {width:width}] } />
  </ScrollView>
</View>

从理论上讲，为了让它变得更好，您可以调用 onChangeText 方法来设置宽度以使其更好（当然，本机方式是理想的）。

然而，在源代码中根本看不到任何配置，希望有人能给出更好的答案！

Answer 2

我能够解决它。

我不知道为什么，但是如果我将 paddingTop 和 paddingBottom 都设置为输入文本，问题就来了。

如果我删除其中一个，那么输入文本就可以正常工作，下面是一个示例：Input text working well

我希望这也能帮助到别人。

谢谢。

文本输入水平滚动

Horizontal scroll on text input

overflow

textinput

react-native