React native add active class when push the button

Question

I have a 3 buttons on react native project iOS app. How can I set class active to clicked button and delete this class from others? Like addClass/removeClass that I had used on jquery?

Answer 1

First have your define your style "class".

const styles = StyleSheet.create({
  btnSelected: {
     ...
  },
  notSelected : {
  }
});

Then you can use a state property in your react component.

example :

state = {
  btnSelected: 1
}

<Button 
    style={(this.state.btnSelected== 1)?styles.btnSelected:styles.notSelected}
    onPress={() => this.setState({ btnSelected: 1 })} ... />
<Button 
    style={(this.state.btnSelected== 2)?styles.btnSelected:styles.notSelected} ... 
    onPress={() => this.setState({ btnSelected: 2 })} .../>
<Button 
    style={(this.state.btnSelected== 3)?styles.btnSelected:styles.notSelected} 
    onPress={() => this.setState({ btnSelected: 3 })} ... />