vincentsty
vincentsty

Reputation: 3221

Prevent react-native alert dismiss onPress button

I have a react-native Alert as follow. What i would like to achieve is to prevent the alert box dimiss onPress and delay alert box dismiss.

How could this be done with react-native built in Alert component?

I am assuming that there is a built in preventAlertBoxDismiss() and dismissAlert() function but couldn't find in documentation.

1) Prevent alert box dismiss onPress button

onPressAskMeLater = () => {
    preventAlertBoxDismiss();
    anyAction();
}

2) Delay alert box dismiss

onPressAskMeLater = () => {
    preventAlertBoxDismiss();
    setTimeOut(3000);
    dismissAlert();
}

Alert code

Alert.alert(
  'Alert Title',
  'My Alert Msg',
  [
    {text: 'Ask me later', onPress: () => this.onPressAskMeLater()},
    {text: 'OK'},
  ],
  {cancelable: false},
);

Upvotes: 2

Views: 2929

Answers (1)

Lenoarod
Lenoarod

Reputation: 3610

the system does not support that method. it belongs to the native UI component. you can use the component to realize the dialog. in that way, you can control the dialog dismiss.

At the same time, you can also use the third library. for example react-native-dialog.

that use it as the following:

    <View>
        <TouchableOpacity onPress={this.showDialog}>
          <Text>Show Dialog</Text>
        </TouchableOpacity>
        <Dialog.Container visible={this.state.dialogVisible}>
          <Dialog.Title>Account delete</Dialog.Title>
          <Dialog.Description>
            Do you want to delete this account? You cannot undo this action.
          </Dialog.Description>
          <Dialog.Button label="Cancel" onPress={this.handleCancel} />
          <Dialog.Button label="Delete" onPress={this.handleDelete} />
        </Dialog.Container>
      </View>
....
showDialog = () => {
    preventAlertBoxDismiss();
    setTimeOut(3000);
    dismissAlert();
    this.setState({ dialogVisible: true });
  };

in the showDialog method, you can delay the dialog dismiss. because it show and dismiss controled by your own state.

Upvotes: 1

Related Questions