React Native样式覆盖的数组

时间:2018-08-01 09:36:14

标签: react-native

我是本机反应的新手,目前正在构建具有搜索功能的应用程序。我正在使用react-native-elements搜索栏,我需要自定义样式in node modules of react native elements的样式,因为它涵盖了clearicon和活动指示器。.现在我的代码就像

<SearchBar
    platform={Platform.OS}
    ref='searchBar'
    autoCorrect={false}
    containerStyle={styles.searchContainer}
    inputStyle={(this.state.loading) ? styles.searchInputLoading : styles.searchInputNoLoading}
    clearIcon={(this.state.Key !== '') ? {style:{right:width*0.12}} : false}
    showLoadingIcon={this.state.loading}
    loadingIcon={(this.state.loading) ? {style:{right:width*0.7 }} : {style:{right:width*0.5}}}
    value={this.state.Key}
    onChangeText={onChangeText}
    onSearchButtonPress={onSearchButtonPress}
    onCancelButtonPress={onCancelButtonPress}
    placeholder='blah blah blah?'
/>

和样式表看起来像

const styles = {
    searchContainer:{
        backgroundColor: 'transparent', 
        borderBottomColor: 'transparent', 
        borderTopColor: 'transparent'
    },
    searchInputLoading:{
        backgroundColor: 'white',
        color: '#000',
        paddingRight: 70
    },
    searchInputNoLoading:{
        backgroundColor: 'white',
        color: '#000',
        paddingRight: 100   
    }
}

但是我的代码产生的结果类似于this

我应该怎么做?对不起,我的帖子格式不好,因为我是新来的

0 个答案:

没有答案