ReactNative的TextInput不可見的iOS

我有以下精簡渲染結果：在其容器「行」：使用flexDirection時ReactNative的TextInput不可見的iOS

return (
    <View style={{backgroundColor:'red'}}> 
    <TextInput value={'Hello'}/> 
    </View> 
);

生成的TextInput是不可見的iOS，除非我指定的高度，，我需要指定它的寬度。

這隻發生在iOS上，Android似乎按預期工作。

有沒有在iOS中顯示TextInput而沒有固定大小的方法？

當前的依賴關係：

"dependencies": { 
    "react-native": "=0.18.1", 
    "react-native-orientation": "=1.12.2", 
    "react-native-vector-icons": "=1.1.0" 
    },

的iOS：

安卓

更改渲染這樣的：

return (
    <View style={{backgroundColor:'red'}}> 
    <Text>text</Text> 
    <TextInput value={'Hello'}/> 
    </View> 
);

有以下結果：

的iOS：

安卓

來源

2016-01-29 Giannis

您需要定義檢測TextInput的高度。嘗試：

return (
    <View style={{backgroundColor:'red'}}> 
    <Text>text</Text> 
    <TextInput style={{ backgroundColor: '#ededed', height: 60 }} value={'Hello'}/> 
    </View> 
);

或者，如果你不想來定義您的TextInput的高度，你可以定義在包含視圖的高度，軟硬度：中TextInput 1：

<View style={{ height:60 }}> 
    <TextInput style={{ flex:1, backgroundColor: '#ededed' }} /> 
</View>

來源

2016-01-29 15:05:55

是的我知道它的作品，如果我這樣做。所以不可能像其他元素一樣佔用可用空間？ – Giannis

不適用於iOS。唯一的解決方法是向容器添加一個高度，並在TextInput中添加一個「flex：1」。我已更新我的代碼以表明這一點。 –

可能需要「#ededed」代替backgroundColor的'ededed'。 – bitsand

面對同樣的問題，但是當我從render()函數的頂級父視圖中刪除alignItems:'center'時，它會呈現。

來源

2018-01-25 05:57:15

ReactNative的TextInput不可見的iOS

回答

相關問題