Adapt React Native AppState changes to the React component lifecycle.
Instead of setting up your own event listeners for
AppState changes, include an
AppStateListener component in your application, passing callbacks as props for the
AppState changes you are interested in.
AppStateListener sets up the listeners for you and then calls your callbacks whenever
yarn add react-native-appstate-listener
npm install react-native-appstate-listener if you prefer).
When some part of your application needs to respond to
AppState changes, add an
AppStateListener to the relevant component.
AppStateListener takes three callbacks as props:
onActiveis called when the application starts running in the foreground. This happens when it first starts up, or when returning from the background or inactive state.
onActiveis also called when the
AppStateListenercomponent is first mounted.
onBackgroundis called when the application moves into the background, either because the user switches to the home screen or another application.
onBackgroundis also called when the
AppStateListenercomponent is unmounted.
onInactiveis called when the application moves into an inactive state. This occurs when transitioning between foreground and background, and during periods of inactivity such as entering the Multitasking view or in the event of an incoming call.
AppStateListener provides default callbacks that do nothing, so you only need to provide the callbacks you're interested in.
Pull requests are welcome!
To get started:
Clone the project.
yarn installto install dependencies.
Make your desired changes. We don't currently have any tests, but if you are adding significant functionality, please get in touch and we'll talk about how to introduce testing.
Ensure that you format the code with prettier by running
yarn run format.
Ensure that the code follows the current style guidelines by running
yarn run lint.
Submit your pull request.
Authored by the Engineering Team of Zeal.
Copyright (c) 2017 Zeal, LLC. Licensed under the MIT license.