使用 react-navigation 通过嵌套路由器注销

Question

我一直在努力使用react-native 和导航器react-navigation 在我的应用构建中实现简单的注销

我的导航器看起来像这样

AuthNavigator (StackNavigator)
----DrawerNavigator (DrawerNavigator)
    ----TabsNavigator (TabNavigator)
        ----Tab1Navigator (StackNavigator)
        ----Tab2Navigator (StackNavigator)
        ----Tab3Navigator (StackNavigator)
        ----Tab4Navigator (StackNavigator)

（这够清楚了吗？）

我的注销按钮位于Tab4Navigator 的屏幕上，我确实需要返回到AuthNavigator，但我无法弄清楚...

我一直在考虑使用像 react-native-restart 这样的包，但我不觉得这真的很“干净”...

提前致谢

Answer 1

我遇到了类似的问题，唯一对我有用的解决方法是手动重置减速器的导航。

const nav = (state, action) => {
  switch (action.type) {
    case 'LOGOUT': {
      return {
          index: 0,
          routes: [{key: 'Init', routeName: 'AuthNavigator'}]
        };
    }
    default:
      return AppNavigator.router.getStateForAction(action, state) || state;
  }
};

其中LOGOUT 是您要注销时从Tab4Navigator 触发的自定义操作，AuthNavigator 是您要在用户注销时显示的屏幕路径。这假设您使用 Redux 来管理导航状态，如此处所述 https://reactnavigation.org/docs/guides/redux 。