React-native-modal: Can't immediatly open a new modal after closing one

[ethanyuwang]

I have two modals and closing the first one leads to opening the second one:

this.setState({
    isFirstModalVisible: false,
    isSecondModalVisible: true,
})

This works fine with react-native's modal, but with react-native-modal, the second one won't show up.

I have tried to use a callback function:

this.setState({isFirstModalVisible: false}, () => {
isSecondModalVisible: true,
})

But it's still not working with react-native-modal

My current solution is to have a timeout function with 0.5s delay to open the second modal, but this introduced an unwanted delay. Are there any other better workarounds without delays?

[eyexx]

I have same issues........

[mmazzarolo]

This is happening because you can't have two modal on screen at the same time and while the modal is transitioning out it is still considered "on screen", which is the reason why your timeout workaround works correctly.

A cleaner and more robust solution is showing the second modal when onModalHide of the first modal is triggered.

Let me know if it fixes your issues.

[eyexx]

@mmazzarolo Thanks it worked! I did not know about that. I try to use modal as the way i use it in React.js

[SwathyPA]

this.setState({loadingModal : false});
setTimeout(function(){this.setState({loadModalConfirm : true})}, 500);

giving a delay to next modal worked for me