Comments (4)
hey @willadamskeane! thanks for the snack! i didn't know this was your (or one of your) use case! what i could suggest, if you want to close a modal and open another one right away (or vice versa), is to use modalfy's calback api instead:
onPress={() => {
- modalfy().closeModal("ModalA");
- modalfy().openModal("ModalB");
+ modalfy().closeModal("ModalA", () => modalfy().openModal("ModalB"));
}}
the reason we need to use a callback is mainly due to 1 thing: animations. by using a callback, modalfy is then able to animate the initial modal out, remove it from the stack and only then animate the new modal in (or vice versa). if we don't order things that way, we end up in the race condition you're facing where modalfy is being asked to animate a modal out, remove it from the internal stack, add another modal to the internal stack, animate that other modal in, and all of that pretty much all at once.
of course we also considered using promises but that api turned out to be quite complex to handle especially since modalfy()
(which can be used outside of react) exist.
even though this callback api is mentioned in the docs, i realised it wasn't the easiest thing to find if you don't know already what exactly you're looking for. therefore, i've updated the main docs to that effect. hope all of this helps!
from react-native-modalfy.
hey @willadamskeane! which version are you using? as well, it would be very helpful if you could provide some reproducible steps in a snack for instance. otherwise, that makes tracking that issue quite tedious.
from react-native-modalfy.
@CharlesMangwa Still working on getting a reliably reproducing snippet together, but it is definitely happening sporadically to our testers. Is there any reason to expect calling "closeModal(modalName)" wouldn't immediately close that modal? It seems to get caught in some sort of queue, but I can't figure out the conditions that lead to that happening. Feels like a race condition.
Any chance you can think of a way to programmatically "force close" a modal, to circumvent this issue temporarily? Clicking the backdrop always closes the modal, so it seems there is another way to close that doesn't get caught in this queue
from react-native-modalfy.
@CharlesMangwa Just to give a little more clarity, the issue is occurring reliably if at least one modal is open, and then that modal is closed while another modal is opened simultaneously. After this, closeModal stops working.
Here is a snack that illustrates the issue: https://snack.expo.dev/@willadamskeane/witty-edamame
from react-native-modalfy.
Related Issues (20)
- Pass UI elements instead of Modal Name HOT 1
- There was no opened 'ModalName' modal warn HOT 1
- Modal does not animate out HOT 1
- Easy way to get modal props HOT 3
- Is it possible to check which modals are currently open before opening a modal? HOT 1
- Modal is opened again after close the first one HOT 6
- Need finish callback if noOpenedItems in queueClosingAction functions is true
- Error raised by FlingGestureHandler (react-native-gesture-handler) HOT 3
- Sending `onAnimatedValueUpdate` with no listeners registered. HOT 6
- [iOS] open modal when screen has options presentation: "modal" HOT 3
- [Android] Cannot read property 'addListener' of undefined HOT 3
- CloseModal causes an infinite loop when used as a dependency for useEffect HOT 2
- How to configure the option to close automatically (e.g. after 3000 ms) and not to close when clicking on the background? HOT 2
- RN 0.73: FlingGestureHandler must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized. HOT 2
- Is it possible to make `params` non-undefined? HOT 1
- Responsive Background HOT 1
- Is it possible to pass a parameter which is a callback function to the modal? HOT 1
- How to prevent clicks on background modals? HOT 5
- How to test modal components with Jest ? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-modalfy.