React Native TextInput總是有黑色邊框

我在React Native中使用TextInput，如果我嘗試向組件添加邊框，那麼在我的彩色邊框上總是有一個正方形的黑色邊框。React Native TextInput總是有黑色邊框

當我刪除我的彩色邊框組件看起來是這樣的：

這裏是我的代碼：

<TextInput 
     returnKeyType="search" 
     style={searchStyle.searchInput} 
     onChangeText={(text) => this.setState({text})} 
     placeholder={this.state.searchText} 
     onSubmitEditing={(event) => this.searchLocationSubmit(event)} 
/> 

const searchStyle = StyleSheet.create({ 
    searchInput : { 
    height: 35, 
    color: '#64AFCB', 
    borderColor: '#64AFCB', 
    borderWidth: 1, 
    borderStyle: 'solid', 
    borderRadius: 15, 
    width: 200, 
    marginLeft: 10, 
    marginTop: 10, 
    backgroundColor: 'white', 
    position: 'absolute', 
    zIndex: 2 
    } 
})

來源

2016-11-12 plmok61

嘗試刪除borderStyle: 'solid'

來源

2016-11-12 06:49:58 vinayr

儘量的

borderWidth: 1,

來源

2016-11-12 13:53:00

接受的答案

borderWidth: 0,

istead並沒有真正回答你的問題。

如果要設置TextInput的邊框顏色，似乎在React Native中會有一個錯誤，它會覆蓋TextInput上的borderColor樣式並將其設置爲黑色。

爲了解決這個問題，我把我的TextInput標籤包裝在View中。我將TextInput的borderWidth設置爲0，然後將包裝視圖設置爲使我想要在輸入上看到的邊框樣式。

<View style={{borderStyle: 'solid', borderWidth: 1, borderColor: '#64AFCB'}}> 
    <TextInput 
     placeholder="MyInput" 
     style={{borderWidth: 0}} 
     value={this.state.myInputValue} 
     /> 
</View>

來源

2017-01-06 15:34:32

React Native TextInput總是有黑色邊框

回答

相關問題