Home > database >  React Native: How to refresh a previous screen WITHOUT navigating to it?
React Native: How to refresh a previous screen WITHOUT navigating to it?

Time:06-15

I'm having a simple issue where I'm transitioning between 3 separate screens:

SCREEN A --> SCREEN B --> SCREEN C

When I'm at screen C and I save something, I can navigate back to Screen B and refresh it. That's no issue.

The problem I'm having is Screen A has a count of items from Screen B. So when I save from Screen C, the list for Screen B gets updated but not the count in Screen A.

All of the solutions I'm seeing are using navigation and passing a parameter but I don't want to navigate to that screen in this circumstance. How would I go about updating Screen A without having to navigate to it?

CodePudding user response:

You could either use a global state using Redux or any other state management tool or pass in a callback method when navigating from screen A to screen B to screen C like so

// Screen A
const [data, setData] = useState();
navigation.navigate('Screen B': {callback: (data) => setData(data)}));

// Screen B
const [data, setData] = useState();
navigation.navigate('Screen C', {callback: (data) => setData(data)}));

const onGoBackPress = () => {
navigation.goBack();
route.params.callback(data)
}
 
// Screen C 
const data = {'some data from screen c'};

const onGoBackPress = () => {
navigation.goBack();
route.params.callback(data);
}
  • Related