How to re-render or refresh previous screen when going back using react router flux

Question

In my react native app I am using react native router flux, while going back to the previous screen I want the previous screen to re-render or refresh. I am using Action.pop() to go back to the previous. How I can refresh the previous screen?

Answer 1

You need to listen "focus" event on navigation object on your screen and add the logic for fetching new data inside the event handler.

function YourScreenComponent({ navigation }) {
  React.useEffect(() => {
    const unsubscribe = navigation.addListener('focus', () => {
      // fetch new data here
    });

    return unsubscribe;
  }, [navigation]);

  return <SomeContent />;
}

Answer 2

I solved it using Action.reset('key of the screen') of react router flux