Call function when returning to React Native app

Question

I have an app that uses this code: Linking.openURL('google.navigation:q='+latitude+'+'+longitude) to exit to google maps in my React Native Expo app. With android (and iOS) you can use the phone's back button to return to your previous app. I am wondering how I can call a function when my app comes back into view. I have some GPS data in my app that I would like to reupdate my data after they move to a location as soon as they return to my app. I found this....

componentWillMount() {
    const { navigation } = this.props;
    this.focusListener = navigation.addListener('didFocus', () => {
       // The screen is focused
       // Call any action
    });
}

But it doesn't seem to call when I return from maps..,

Is this close or am I doing it completely wrong?

Thanks

componentWillMount executes only once in the component life cycle. You probably need componentDidUpadte method (condition: your component gets updated when you come back to the view). — ravibagul91
– ravibagul91, Commented Nov 22, 2019 at 3:38

Lenoarod · Accepted Answer · 2019-11-22 05:04:41Z

you can use the AppState to realize it.

componentDidMount(){
 AppState.addEventListener('change', this.handleAppStateChange);
}

handleAppStateChange = (nextAppState) => {
        //the app from background to front
        if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') {

        }
//save the appState
this.setState({ appState: nextAppState });
    }

the source code comment says:

 *AppStateIOS can tell you if the app is in the foreground or background,
 * and notify you when the state changes.
 *  * AppStateIOS is frequently used to determine the intent and proper 
 * behavior
 * when handling push notifications.
 *  * iOS App States
 *      active - The app is running in the foreground
 *      background - The app is running in the background. The user is 
 *either in another app or on the home screen
 *      inactive - This is a transition state that currently never happens 
 * for typical React Native apps.

the different state meaning:

active - The app is running in the foreground
background - The app is running in the background.
The user is either:
1, in another app
2, on the home screen
[Android] on another Activity (even if it was launched by your app)
[iOS] inactive - This is a state that occurs when transitioning between foreground & background, and during periods of inactivity such as entering the Multitasking view or in the event of an incoming call

you have to carefully handle the state for android.

Collectives™ on Stack Overflow

Call function when returning to React Native app

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related