React-Native ScrollView makes TextInput vanish

Question

作为React Native的新手，希望这是一个明显的疏忽，但我已经试验过了，没有找到解决方案。这是一个非常简单的问题:当我有几个视图和一个TextInput时，一切都按预期的方式展开。当我在ScrollView中包装它们时，视图仍然存在，但TextInput不再呈现。我一直不明白为什么。

为了测试和分享它，我创建了一个rnplay应用程序:https://rnplay.org/apps/P774EQ

可以看到，视图中包装TextInput的文本如预期的那样出现，但是TextInput不在那里。如果你只是删除ScrollView(第18行&39)，文本输入出现。

希望有经验的人会看看这个，并在几秒钟内给出答案，因为我很确定我只是错过了一些明显的东西。

Answer 1

1)第17行:style={styles.scrollview} => style={styles.scrollView}，你有一个拼写错误。

2)使用contentContainerStyle ScrollView(关于contentContainerStyle的更多细节)

<ScrollView keyboardDismissMode='interactive' style={styles.scrollview} contentContainerStyle={styles.contentContainerStyle}>

这里是contentContainerStyle:

contentContainerStyle: {
    flex: 1,
}

3)由于inputcontainer的flex为.75, message样式的flex属性最好设置为.125。