0

I have main screen A. From A it's possible to navigate B, C, D screens. In most cases I need to refresh screen A on focus event, only A shouldn't be refreshed when navigating back from D.

How can I implement this scenario in react native using hooks?

ZHSX
  • 41
  • 4

1 Answers1

0

I think you can use the react navigation lifecycle events like this

function Profile({ navigation }) {
  React.useEffect(() => {
    const unsubscribe = navigation.addListener('focus', () => {
      // Screen was focused
      // Do something
    });

    return unsubscribe;
  }, [navigation]);

  return <ProfileContent />;
}

here is the documentation: https://reactnavigation.org/docs/navigation-lifecycle#react-navigation-lifecycle-events

BenNG
  • 531
  • 1
  • 4
  • 12
  • I don't want to refresh screen when coming back from e.g D screen, other cases I should refresh. Now I am adding a route parameter refreshScreen : false in D screen. In parent screen I have this `useFocusEffect( useCallback(() => { if (refreshScreen) fetchData() return () => { // here I want to reset refreshScreen. navigation.setParams({refreshScreen: true}); /// this is prompting an error when moving back to the root screen. //the action SET_PARAMS with payload was not handled by any navigator. } }, [isConnected, refreshScreen]));` – ZHSX Sep 01 '22 at 20:14