使用反应导航将导航历史记录重置为登录屏幕

Question

登录后（欢迎使用）用户导航到首页后，我重置历史记录，以便用户不能像这样回去：

const actionToDispatch = NavigationActions.reset({ 
      index: 0, 
      actions: [NavigationActions.navigate({ routeName: 'Home' })] 
     }); 

     this.props.navigation.dispatch(actionToDispatch); 

此功能正常。按下注销后，用户应该返回欢迎页面，但它不起作用。以下是我在做什么：

const resetAction = NavigationActions.reset({ 
      index: 0, 
      actions: [ 
       NavigationActions.navigate({ routeName: 'Welcome' }), 
      ] 
     }); 

     this.props.navigation.dispatch(resetAction); 

该错误说明没有“欢迎”路线。必须是“主”，“隐私”，“条款”之一，这是主页中某个选项卡的路线。看到他们在下面：

const AppStack = StackNavigator({ 
        Welcome: { 
         screen: Welcome 
        }, 
        Home: { 
         screen: Tabs 
        } 
       }, { 
         initialRouteName: this.state.isLoggedIn ? 'Home' : 'Welcome', 
         headerMode: 'none' 
        } 
       ); 

export const ProfileStack = StackNavigator({ 
    Profile: { 
     screen: Profile, 
    }, 
}); 

export const SettingsStack = StackNavigator({ 
    Settings: { 
     screen: Settings, 
    }, 
}, { 
    }); 

export const InfoStack = StackNavigator({ 
    Main: { 
     screen: Main, 
    }, 
    Privacy: { 
     screen: Privacy 
    }, 
    Terms: { 
     screen: Terms 
    } 
}); 

const routeConfiguration = { 

    Profile: { screen: ProfileStack }, 
    Settings: { screen: SettingsStack }, 
    Info: { screen: InfoStack } 
}; 

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

export const Tabs = TabNavigator(routeConfiguration, tabBarConfiguration); 

Answer 1

我在这里找到了解决办法：https://github.com/react-community/react-navigation/pull/789。

const resetAction = NavigationActions.reset({ 
      index: 0, 
      actions: [ 
       NavigationActions.navigate({ routeName: 'Welcome' }), 
      ], 
      key: null 
     }); 

this.props.navigation.dispatch(resetAction); 

关键：空是重要的组成部分。