React Native：TextInput 在 Flex 布局中消失答案

【问题标题】：ReactNative: TextInput disappear in FlexLayoutReact Native：TextInput 在 Flex 布局中消失
【发布时间】：2016-06-15 01:44:55
【问题描述】：

我正在学习 react-native，当我尝试在 flex 布局中使用 TextInput 组件时，它消失了。

index.android.js

//....
render(){
    return (
        <View style={  {flex:1,flexDirection:'row'}}>
            <TextInput placeholder="test"/>
        </View>
    )
}

//....

我很困惑。

【问题讨论】：

标签： react-native

【解决方案1】：

您需要在 TextInput 上设置一个高度：

<TextInput placeholder="test" style={{ height:60 }} />

【讨论】：

【解决方案2】：

我尝试设置 TextInput 的高度，但它不起作用。我终于成功地将宽度或 {flex:1} 设置为 TextInput。我想，当parant容器设置为{flexDirection：“row”}时，TextInput的宽度为0，所以我看不到它。默认情况下，父容器的flex方向是'column'，TextInput Element调整自身的{flex:1}来填充父容器。

【讨论】：

很好的解释。经过几个小时痛苦地修改 flexbox 后找到了答案......