React Native、Androidのライフサイクルとナビゲーション

Question

私たちは、redux-persistを使用してナビゲーション状態を含むアプリ状態を保存するReact Nativeアプリを構築しています。このアプリがネイティブアプリのように動作するようにしたいと考えています。

ネイティブAndroidアプリがバックグラウンドに入り、最終的にOSによって停止され、フォアグラウンドに移行すると、ユーザーが以前に中止したアクティビティ同じアプリがユーザー（またはクラッシュ）によって殺された場合、メインのアクティビティで開きます。

RNアプリの場合、これはredux-persistがアプリのcomponentWillMountのナビゲーション状態を維持して復元する必要があることを意味します。ただし、アプリがユーザーによって強制終了されなかった場合のみです。

次のコードは動作します：

componentWillMount() { 
    if (global.isRelaunch) { 
    // purge redux-persist navigation state 
    } 
    global.isRelaunch = true; 
... 

しかし、それはハック見て、グローバルスコープが存続なぜ私も理解していません。

RNアプリがバックグラウンドから再オープンされたかどうかを検出する適切な方法は何ですか？ semirturgayの答え@

import React, {Component} from 'react' 
import {AppState, Text} from 'react-native' 

class AppStateExample extends Component { 

    state = { 
    appState: AppState.currentState 
    } 

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

    componentWillUnmount() { 
    AppState.removeEventListener('change', this._handleAppStateChange); 
    } 

    _handleAppStateChange = (nextAppState) => { 
    if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') { 
     console.log('App has come to the foreground!') 
    } 
    this.setState({appState: nextAppState}); 
    } 

    render() { 
    return (
     <Text>Current state is: {this.state.appState}</Text> 
    ); 
    } 

} 

Answer 1

あなたはreact-native

チェックこの例で提供されるAPIであるAppStateに見てみる必要がありますアプリ。 Androidの場合、自宅または最近のアプリボタンのクリックを検出する方が良い方法です。これは、ソーシャルメディアや写真などの他のアプリからのフラグメントがバックグラウンド状態を引き起こすためです。アプリに残っているため、カメラなどのプロフィールに写真を追加しているために不要です。 Androidの最近のアプリボタンのクリック数はreact-native-home-pressedです。このライブラリは単にアンドロイドボタンイベントを公開します。

npm i react-native-home-pressed --saveでライブラリをインストールしてから、react-native linkにリンクしてください。次に、あなたのアプリを再構築し、次のスニペットを追加します。

import { DeviceEventEmitter } from 'react-native' 
 

 
class ExampleComponent extends Component { 
 
    componentDidMount() { 
 
    this.onHomeButtonPressSub = DeviceEventEmitter.addListener(
 
    'ON_HOME_BUTTON_PRESSED', 
 
    () => { 
 
     console.log('You tapped the home button!') 
 
    }) 
 
    this.onRecentButtonPressSub = DeviceEventEmitter.addListener(
 
    'ON_RECENT_APP_BUTTON_PRESSED', 
 
    () => { 
 
     console.log('You tapped the recent app button!') 
 
    }) 
 
    } 
 
    componentWillUnmount(): void { 
 
    if (this.onRecentButtonPressSub) this.onRecentButtonPressSub.remove() 
 
    if (this.onHomeButtonPressSub) this.onHomeButtonPressSub.remove() 
 
    } 
 
}

Answer 2

は離脱検出を行うための一つの方法である：（理想的にはiOSのサポート付き）