0

I am using react-native-actionsheet to show dropdown in iOS, I was able to get the selected index, however, I don't know what is the syntax to get the selected value also.

showActionSheet = () => {
  this.ActionSheet.show()
}

handlePress = (buttonIndex,  option) => {
  this.setState({ selected: buttonIndex, Region: options})
}

     <Text style={styles.inputfields} onPress={this.showActionSheet}>Region</Text>
        <ActionSheet
      ref={o => this.ActionSheet = o}
      title={'Region'}
      options={['North', 'South', 'East', 'West', 'Cancel']}
      cancelButtonIndex={5}
      selectedValue={this.state.Region}
      value={this.state.Region}
      onPress={this.handlePress}
    />

2 Answers2

0

Make a variable with your option array

const options = ['AUH', 'DXB', 'NE', 'WR', 'AAN', 'Cancel']

Pass that variable to your ActionSheet component

<ActionSheet
  ref={o => (this.ActionSheet = o)}
  title={"Region"}
  options={options}
  cancelButtonIndex={5}
  selectedValue={this.state.Region}
  value={this.state.Region}
  onPress={this.handlePress}
/>;

Inside your handlePress now you can access your selected value as below

handlePress = buttonIndex => {
  this.setState({
    selected: buttonIndex,
    Region: options[buttonIndex]
  });
};

Hope this helps you. Feel free for doubts.

SDushan
  • 4,341
  • 2
  • 16
  • 34
0

Well I dont really know about react-native-actionsheet but i build

react-native-universal-actionsheet its much easier to customize and control.

See here is an example at snack

Alen.Toma
  • 4,684
  • 2
  • 14
  • 31