React-native - 有條件地設置高度

因此對於<TextInput>對於ios，您需要設置高度。然而，對於android你並不需要。所以我想知道如何才能設置一個高度只有當操作系統匹配ios。我瞭解平臺，但當我嘗試應用某些邏輯時，我會遇到錯誤。這是我的嘗試：React-native - 有條件地設置高度

<TextInput 
     onChangeText={(input) => this.setState({user: input})} 
     maxLength={10} 
     placeholder="Enter a name" 
     {(Platform.OS === 'ios') ? "height={20}" : ""} 
     style={{ width: 150, textAlign: "center"}} 
    />

來源

2017-03-10 A. Lau

其實我認爲更好的事情是：

const style = { 
    width: 150, 
    textAlign: "center", 
    ...Platform.select({ios: {height: 20}}) 
} 
<TextInput 
    onChangeText={(input) => this.setState({user: input})} 
    maxLength={10} 
    placeholder="Enter a name" 
    style={style} />

這樣，你不重複的樣式的休息，你避免任何醜陋的條件在你的代碼中，所以它更具可讀性。

可以在react-native docs

來源

2017-03-10 05:03:53 atlanteh

瞭解Plaform.select是啊，這是更多的我一直在尋找的東西，這東西就不會逼我重複的代碼，但在必要時將其插入。謝謝。「......」是一個傳播運算符嗎？ –

是的。 ...是一個擴展運算符，因此對於iOS高度被擴展到樣式對象，並且對於android，當您嘗試傳播未定義時，操作符將被跳過。 – atlanteh

React-native - 有條件地設置高度

回答

相關問題