Question

我正在尝试实现两个文本输入。我不确定最佳做法是将它们包装在滚动视图中。但是，当我按照下图所示进行操作时，我只看到中间的一行。

如果我删除滚动视图并只保留一个文本输入，它会显示一个包含输入的框，我可以与之交互。虽然我仍然无法让键盘显示在模拟器上。但我可以手动输入并更改状态。

有关如何允许多个文本输入的任何想法，以及如何显示从底部弹出的本机键盘？

render() {
    return (
      <ScrollView>
      <TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        placeholder="Enter item 1"
        value={this.state.text}
        onChangeText={this.onChange} />
        <TextInput
          style={{height: 40, borderColor: 'gray', borderWidth: 1}}
          placeholder="Enter item 2"
          value={this.state.text}
          onChangeText={this.onChange} />
      </ScrollView>
    );
  }

Answer 1

1 - 对于iOS模拟器，有一个选项硬件 - ＆gt;键盘 - ＆gt;切换软件键盘（默认情况下未选中）。选中此选项可以解决显示本机键盘的问题。

2 - 关于多行文本输入。是的，这是一个问题，但下面的答案中有一个共享的工作。我会附上答案的链接供您参考。

P.s：我自己没有尝试过，但答案已被标记为解决了这个问题！

Multi-Line TextInput Hack - https://stackoverflow.com/a/31759113/5783646

Answer 2

在iOS模拟器中显示键盘：硬件 - ＆gt;键盘 - ＆gt;切换软件键盘
显示多个文本输入：我的猜测是，对父元素或其他地方应用（或未应用）样式会阻止TextInput以可用大小呈现。

我在RN Playground上创建了一个示例，演示了您的要求：https://rnplay.org/apps/ldlfWw

带有React Native的TextInput显示一行

2 个答案: