2017-07-26 72 views
0

我在尝试将styles container中的backgroundColor值与state: color关联,所以背景颜色将更改为我在textInput上放置的任何颜色。这是我的代码。谢谢!传递一个状态值React Native

import React, {Component} from 'react'; 
import { StyleSheet, Text, View, TextInput } from 'react-native'; 

export default class App extends Component { 
    state = { 
     color: '', 
    }; 

    _color = (text) => {this.setState({color: text})}; 
    _applyAndClear =() => { 
          this.setState({color: ''})} 

    render() { 
    return (
     <View style={styles.container}> 
     <TextInput 
      style={styles.input} 
      value = {this.state.color} 
      onChangeText = {this._color} 
      onSubmitEditing = {this._applyAndClear} 
     /> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    backgroundColor: 'someColor', 
    alignItems: 'center', 
    justifyContent: 'center', 
    }, 
    input: { 
    borderWidth: 3, 
    width: 100, 
    height: 40, 
    borderColor: 'white', 
    alignItems: 'center', 
    justifyContent: 'center', 
    } 
}); 

回答

0

你可以用下面这样做:

<View style={[styles.container, { backgroundColor: this.state.color }]}> 
相关问题