如何检查React Native中的视图状态？

我正在尝试更新按钮按下时的视图的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> 
    ); 
}

我如何检查什么鉴于当前的颜色，以便确定什么颜色，将其更改按下按钮时？

来源

2017-09-27 josh.n

你应该做的

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> 
); 
}

来源

2017-09-27 00:47:33

虽然穆罕默德的方法是有效的Facebook目前建议传递一个函数，而不是对setState对象时，新的状态取决于旧状态(according to the docs)。因此你应该做this.setState((prevState) => ({viewColour: prevState.viewColour == 'red' ? "orange" : 'red'}))

来源

2017-09-27 01:00:17

如何检查React Native中的视图状态？

回答

相关问题