2017-04-21 15 views
1

私のアプリにはログイン画面があり、ログインシステムにはメイン画面が表示され、タブを切り替えて画面を切り替えることができます。しかし、今、私は '履歴'をタップすると、それはログイン画面に戻って、これを処理する方法は? enter image description hereReduxでネストされたTabNavigatorを処理する方法

enter image description here

これは私のルートの設定です:

const MainScreen = TabNavigator({ 
    Map:{ screen: Map}, 
    History:{ screen:History}, 
}); 
export const AppNavigator = StackNavigator(
    { 
     Main: { screen: MainScreen }, 
    Login: { screen: LoginScreen }, 
}, 
    { 
     headerMode:'screen', 
    } 
); 


const AppWithNavigationState = ({dispatch, nav}) => { 
    return (
     <AppNavigator navigation={addNavigationHelpers({ dispatch, state: nav })} 
/> 
    ); 
}; 


AppWithNavigationState.propTypes = { 
    dispatch: PropTypes.func.isRequired, 
    nav: PropTypes.object.isRequired, 
}; 

const mapStateToProps = state => ({ 
    nav: state.nav, 
}); 

export default connect(mapStateToProps)(AppWithNavigationState); 

関数NAV(状態= initialNavState、アクション){

switch (action.type) { 

    case LOGIN:{ 
     console.log('excute login operator ......',); 
     return AppNavigator.router.getStateForAction(NavigationActions.reset({ 
      index: 0, 
      actions: [ 
       NavigationActions.navigate({ routeName: 'Main'}) 
      ] 
     }), state); 
    } 
    case LOGOUT: 
     console.log('excute logout operator ......'); 
     return initialNavState; 
    default: 
     return initialNavState; 
} 
} 

私は問題を見つけます。ログインをクリックしてタブ画面に移動すると、レジューサーが2回トリガーします.1つはLOGINで、もう1つはデフォルトです。私はデフォルトがタブアクションだと思う。では、入れ子になったTabNavigatorでタブアクションを処理する方法は?

答えて

3

ここにはGithubでreduxを使用したtabNavigatorの例https://github.com/parkerdan/SampleNavigationが役立つことを願っています。

+0

ありがとう、私はデモを見ていない、今私はこの質問を把握しています。 –

+0

これは私が見つけることができるreduxとの反応ナビゲーションの良い例です。 – Felix

関連する問題