React Native Elements ButtonGroup - Enable button when conditions are met

Question

I am using react-native-elements ButtonGroup with 3 buttons. I need to disable all buttons when the application starts, when conditions are met, I need to enable specific buttons.

Ive disabled all buttons using the false flag but I'm not sure how to enable specific buttons with a conditional statement and state.

Any help would be appreciated.

<ButtonGroup
  onPress={this.updateIndex}
  selectedIndex={selectedIndex}
  buttons={buttons}
  containerStyle={{ height: 100 }}
  //disabled={[0, 1, 2]}
  disabled={true}
/>

ADD_DETAILS(index) {
  if (index === 0) {
    console.log("clicked 0");
    this.requestDetails();
  }
}

Answer 1

You can store your disabled buttons in your state for example:

this.state = {
  selectedIndex: 2,
  disabled:[], // you store your disabled buttons here
}

<ButtonGroup
 onPress={this.updateIndex}
 selectedIndex={selectedIndex}
 buttons={buttons}
 containerStyle={{height: 100}}
 disabled={this.state.disabled}
/> 

if you have ButtonGroup like this, you can disable buttons (for example first and third on button click ) like this:

  <Button
  title={"disable first and third buttons"}
  onPress={()=>{
    this.setState({disabled:[0,2]}); // here you update which buttons you want to disable
  }}/>