react native ios alert overriding each other

Viewed 513

I am using Alert.alert() for displaying alert in react native ios. Problem i am facing is that if tow alert of same message appears they appear one above the other.

While in android second alert appear after dismissing the first one.

Anyway to make it behave like android in ios?

1 Answers

You can add a certain state boolean to check if alert is visible or not such as

  state = {
    alertBoxVisible: false,
  }

  onAlertShow = () => {
    if(!this.state.alertBoxVisible) {
      this.setState({alertBoxVisible: true}, () => {
        Alert.alert(
          'Alert Title',
          'My Alert Msg',
          [
            {text: 'OK', onPress: () => this.setState({alertBoxVisible: false})},
          ],
          { cancelable: false }
        )
      })
    }
  }

and use async await to chain the functions that call the onAlertShow such as

onPress={async () => {
  await this.onAlertShow()
  await this.onAlertShow()
}}
Related