2017-09-27 13 views
0

ボタンを押したときの表示のbackgroundColorを更新しようとしています。色が赤であれば、オレンジ色に変えたいと思います。React Nativeのビューの状態を確認する方法は?

私は現在、ボタンを赤からオレンジに変更していますが、その逆はありません。

constructor(props) { 
    super(props); 
    this.state = { 
     viewColour: "red", 
    } 
} 

render() { 
    return (
     <View style={styles.parentView}> 
      <Button 
       title="Press here" 
       onPress={() => this.setState({viewColour:"orange"})} 
      /> 

      <View style={Object.assign({}, styles.colourSquare, {backgroundColor: this.state.viewColour})}/> 
     </View> 
    ); 
} 

ボタンを押したときにどの色に変更するかを決定するために、現在のビューの色を確認するにはどうすればよいですか?

答えて

0

モハメッドの方法は、新しい状態は古い状態(according to the docs)に依存する場合に有効なFacebookは今の代わりにオブジェクトのSETSTATEに関数を渡すことをお勧めですが、あなたは

render() { 
return (
    <View style={styles.parentView}> 
     <Button 
      title="Press here" 
      onPress={() => this.setState({viewColour: this.state.viewColour == 'red' ? "orange" : 'red'})} 
     /> 

     <View style={[styles.colourSquare, {backgroundColor: this.state.viewColour}]}/> 
    </View> 
); 
} 
0

を行う必要があります。したがって、あなたはすべきですthis.setState((prevState) => ({viewColour: prevState.viewColour == 'red' ? "orange" : 'red'}))

関連する問題