Wen using react-navigation for modals, isFocused becomes useless

Viewed 238

I wanted to bring our app's modal system into react-navigation for various reasons, and did a little research and found their own implementations amongst others. https://reactnavigation.org/docs/modal

I have a very large app and it has taken a couple of days to move the system over. I now have a setup that looks something like this:

TopNavigator
    |
    --- MyAppNavigator
    |          |
    |          ---- SomeScreen
    |          ---- SomeScreen2
    |
    --- MyModal

The modal screen has a transparent background and is using 'modal' mode

Now this is finished I have suddenly realised that isFocus changes every time i open a modal (I know - obvious - i should have looked into this at the start). This is really bad as I am using this effect to load data, scroll to the beginning of lists and a bunch of other things which is all interrupted by the modal.

I have tried to make my own hook that changes isFocused only if the new route is not MyModal, but this doesn't seem possible as blur and focus events have no additional data, and state event is not fired when MyModal is added to the stack.

I've also read a ton of docs and looked through all the available hooks in the react-nav codebase but nothing seems to help.

This seems to entirely break the concept of using react-navigation for modals!!

Thanks in advance for any help.

"react": "16.9.0",
"react-native": "0.61.5",
"@react-navigation/native": "5.8.6",
"@react-navigation/stack": "5.12.3",
0 Answers
Related