2017-05-03 6 views
4

Ich habe die folgende Struktur:Zurücksetzen der TabNavigator Geschichte mit Navigation reagieren

const routeConfiguration = { 
     Login: { screen: Login }, 
     Home: { screen: TabBar }, 
    }; 

    const stackNavigatorConfiguration = { 
     headerMode: 'screen', 
     navigationOptions: { 
      header: { visible: false } 
     } 
    }; 

export const RootNav = StackNavigator(routeConfiguration, stackNavigatorConfiguration); 

Mein TabBar- wo jeder Tab eine eigene StackNavigator hat:

const routeConfiguration = { 
    TabOneNavigation: { screen: TabOneNavigation }, 
    TabTwoNavigation: { screen: TabTwoNavigation }, 
    TabThreeNavigation: { screen: TabThreeNavigation }, 
}; 

const tabBarConfiguration = { 
    tabBarOptions: { 
     activeTintColor: 'white', 
     inactiveTintColor: 'lightgray', 
     labelStyle: { 
      fontSize: 10, 
      fontFamily: Fonts.book 
     }, 
     style: { 
      backgroundColor: Colors.greenLightGradient, 
      borderTopWidth: 1, 
      borderTopColor: Colors.tabGreenLine 
     }, 
    } 
}; 

export const TabBar = TabNavigator(routeConfiguration, tabBarConfiguration); 

Wenn die App zuerst laden Es Bildschirm zur Anmeldung geht . Nach erfolgreicher Anmeldung nutze ich actionTypes.TO_HOME, um zu Home zu gelangen. Dort habe ich 3 Registerkarten (Feed, Suggestion, Profile). Auf der Registerkarte "Profil" habe ich die Schaltfläche "Abmelden" gedrückt, auf der ich den Navigationsverlauf zurücksetze und zu "Noch einmal anmelden" (so weit so gut) gehe. Aber wenn ich mich wieder anmelde und zu Home gehe, zeigt es den ersten Tab für eine Sekunde an und navigiert mich zum letzten (Profil), der so aussieht, als ob der TabNavigator-Verlauf nicht zurückgesetzt wird. Soll ich etwas Besonderes machen, damit auch der Verlauf des TabNavigators zurückgesetzt wird?

Das ist mein Minderer für die Geschichte zurückzusetzen und geht zum Login-Bildschirm:

export const navReducer = (state = initialState, action = {}) => { 
    let nextState; 
    switch (action.type) { 
     case actionTypes.TO_LOGIN: 
      nextState = RootNav.router.getStateForAction(
       NavigationActions.reset({ 
        index: 0, 
        actions: [NavigationActions.navigate({ type: NavigationActions.NAVIGATE, routeName: actionTypes.TO_LOGIN })], 
        key: null 
       }), state); 
      break; 

     case actionTypes.TO_HOME: 
      nextState = RootNav.router.getStateForAction(
       NavigationActions.reset({ 
        index: 0, 
        actions: [NavigationActions.navigate({ type: NavigationActions.NAVIGATE, routeName: actionTypes.TO_HOME })], 
       }), state); 
      break; 

     default: 
      nextState = RootNav.router.getStateForAction(action, state); 
      break; 
    } 

    return nextState || state; 
}; 

Antwort

0

Sie den Index 0 auf navigate Aktion setzen kann

+0

Es funktioniert nicht. Der Effekt ist der gleiche. Ich habe meine Frage mit mehr Informationen und Code aktualisiert. – jazzdle

Verwandte Themen