react-native-app-state
react-native-app-state
is a declarative way to use react-native's AppState.
Internally it uses the new React 16.3 Context API.
I think you got it. It's definitely easier than:
Getting started
Requirements
Because this library uses the new React 16.3 Context API, you need at least React 16.3.
Installation
Yarn (recommended)
$ yarn add react-native-app-state
npm
$ npm install react-native-app-state --save
Usage
See the example project under example/
import AppState from 'react-native-app-state'; PureComponent { console; // E.g. output: "App onAppStateChange() background => active" }; { return <View> <AppState => appState <View> <Text =>App state: appState</Text> </View> </AppState> /* ------ OR ------ */ <AppState => <AppState.Active> <Text>App is active</Text> </AppState.Active> <AppState.Inactive> <Text>App is inactive</Text> </AppState.Inactive> <AppState.Background> <Text>App is in background</Text> </AppState.Background> </AppState> </View> ; }
ToDO
- Write tests
- Add/Replace example with expo
- Add usage examples
- component based
<AppState.Active>
,<AppState.Inactive>
,<AppState.Background>
-
<AppState.Foreground>
alias for<AppState.Active>
and<AppState.Inactive>
- with render prop
<AppState>{({ appState }) => (<View />)}</AppState>
- component based