I wanted to open the modal of the another screen (lets say B) from my current screen(lets say A) by passing the props as { showModal: true }
.
In my screen A, I have passed the props from A to B like:
Navigation.push(componentId,'B',null,{showModal: true});
In my screen B, I got props showModal
and open the modal of screen B like:
useEffect(() => {
// some async API calls
},[]);
useEffect(() => {
if (showModal) {
setTimeout(() => modalRef.current?.setModal(true), 4000); // inside the async function call
}
}, []);
Here you can see i have shown the modal using the ref, but not state because there was other neighbour states which caused re-rendering issue and the modal was not opening. In this case, the modal opens up as i have delayed the opening of the modal since there are some other async API calls as well.
So my question is that is there other alternative solution than this?
2
Answers
You can use AppNavigator to go to the next screen.
I think setTimeout is the wrong approach because anyone does not know about time for APIs fetching so, You can open the model after all APIs successfully fetched.