Javascript 注销后无法导航到登录屏幕。

我正在使用ReactNavigation，登录后，我进入我的主页。我的主页有4个选项卡，在第4个选项卡上我有注销按钮。单击注销按钮后，我应该返回登录屏幕

我面临的问题是，我无法重置选项卡导航器。

          this.props.navigation.dispatch({
        type: NavigationActions.NAVIGATE,
        routeName: 'SignIn',
        action: {
          type: NavigationActions.RESET,
          index: 0,
          actions: [{type: NavigationActions.NAVIGATE, routeName: 'SignIn'}]
        }
      })

---

我尝试应用上面的代码块进行导航，但没有成功。请告诉我，如何退出选项卡导航器。

您的根级别导航应该是一个

堆栈导航器

，其子级如下所示：

• 欢迎屏幕
• 登录屏幕
• 选项卡导航器（用于登录主屏幕）
  • 表1
  • 表2
  • 表3
  • 表4（带注销按钮）

要重置

TabNavigator

，不应分派类型为

NavigationActions.NAVIGATE

的操作，因为这将推送到当前导航堆栈上，而不是从状态中删除选项卡navigator。相反，考虑使用A。因此，注销函数中的代码应具有：

const resetAction = NavigationActions.reset({
  index: 0,
  actions: [
    NavigationActions.navigate({ routeName: 'Login'})
  ]
})
this.props.navigation.dispatch(resetAction);

---

按下注销按钮，我们将调用下面的代码

  const resetAction = NavigationActions.reset({
  index: 0,
  actions: [NavigationActions.navigate({ routeName: "SignIn" })],
    key: null 
  });
  this.props.navigation.dispatch(resetAction);

这是我们的AppNavigation文件，有没有办法在注销时重置应用程序

const PrimaryNav = StackNavigator(
  {
    SignIn: {
      screen: SignIn,
      navigationOptions: {
        headerMode: "none",
        header: null
      }
    },
    SignUp: {
      screen: SignUp,
      navigationOptions: {
        headerMode: "none",
        header: null
      }
    },
    TabsScreen: {
      screen: TabsScreen,
      navigationOptions: {
        headerMode: "float",
        headerTitleStyle: { color: "#ffffff" },
        gesturesEnabled: true,
        header: null,
      }
    },
)
export const sideMenuStack = StackNavigator({
    SideMenu: {
        screen: SideMenu,
        navigationOptions: {
            headerMode: "none",
            header: null
        }
    },
    Settings: {
        screen: Settings,
        navigationOptions: ({ navigation }) => ({
            title: "Settings",
        })
    },
    SignIn: {
      screen: SignIn,
      navigationOptions: {
        headerMode: "none",
        header: null
      }
    },
)
export const FeedsStack = StackNavigator({
    FeedsStack: {
        screen: FeedsStack,
        navigationOptions: {
            headerMode: "none",
            header: null
        }
    },
    Post: {
        screen: Post,
        navigationOptions: ({ navigation }) => ({
            title: "Post",
        })
    },
)
export const UserStack = StackNavigator({
    UserStack: {
        screen: UserStack,
        navigationOptions: {
            headerMode: "none",
            header: null
        }
    },
    Friends: {
        screen: Friends,
        navigationOptions: ({ navigation }) => ({
            title: "Friends",
        })
    },
)
export const TabView = TabNavigator(
  {
    FeedsStack: {
      screen: FeedsStack,
      navigationOptions: {
        tabBarLabel: "Feeds",
        scrollEnabled: true,
        focussed: true,
        tabBarIcon: ({ tintColor }) =>
          <Image
            source={Images.feedsActive}
            style={[styles.icon, { tintColor: tintColor }]}
          />
      }
    },
    UserStack: {
      screen: UserStack,
      navigationOptions: {
        tabBarLabel: "Users",
        tabBarIcon: ({ tintColor }) =>
          <Image
            source={Images.UserActive}
            style={[styles.icon, { tintColor: tintColor }]}
          />
      }
    },
    sideMenuStack: {
      screen: sideMenuStack,
      navigationOptions: {
        tabBarLabel: "More",
        headerMode: "screen",
        tabBarIcon: ({ tintColor }) =>
          <Image
            source={Images.moreActive}
            style={[styles.icon, { tintColor: tintColor }]}
          />
      }
    }
  },
  //Default configurations for Tabs
  {
    tabBarPosition: "bottom",
    animationEnabled: true,
    tabBarOptions: {
       indicatorStyle:{
        borderBottomColor:'#32a1fe',
        borderBottomWidth:3
      },
      showLabel: true,
      backBehavior: "none",
      showIcon: true,
      activeTintColor:"#338AD8",
      inactiveTintColor:"#BEC5CB",
      upperCaseLabel:false,
      labelStyle :[styles.labelStyle],
    }
  }
);

const PrimaryNav=StackNavigator(
{
签名：{
屏幕：签名，
导航选项：{
headerMode:“无”，
标题：空
}
},
报名：{
屏幕：注册，
导航选项：{
headerMode:“无”，
标题：空
}
},
选项卡屏幕：{
屏幕：选项卡屏幕，
导航选项：{
headerMode:“浮动”，
headerTitleStyle:{color:#ffffff}，
手势启用：正确，
标题：null，
}
},
)
export const sideMenuStack=StackNavigator({
侧菜单：{
屏幕：侧菜单，
导航选项：{
headerMode:“无”，
标题：空
}
},
设置：{
屏幕：设置，
导航选项：（{navigation}）=>({
标题：“设置”，
})
},
签名：{
屏幕：签名，
导航选项：{
headerMode:“无”，
标题：空
}
},
)
导出常量FeedsStack=StackNavigator({
FeedsStack：{
屏幕：FeedsStack，
导航选项：{
headerMode:“无”，
标题：空
}
},
职位：{
屏幕：Post，
导航选项：（{navigation}）=>({
标题：“帖子”，
})
},
)
export const UserStack=StackNavigator({
用户堆栈：{
屏幕：UserStack，
导航选项：{
headerMode:“无”，
标题：空
}
},
朋友们：{
屏幕：朋友们，
导航选项：（{navigation}）=>({
标题：“朋友”，
})
},
)
export const TabView=TabNavigator(
{
FeedsStack：{
屏幕：FeedsStack，
导航选项：{
tabBarLabel：“提要”，
scrollEnabled:true，
聚焦：正确，
tabBarIcon:（{tintColor}）=>
}
},
用户堆栈：{
屏幕：UserStack，
导航选项：{
tabBarLabel：“用户”，
tabBarIcon:（{tintColor}）=>
}
},
sideMenuStack：{
屏幕：sideMenuStack，
导航选项：{
tabBarLabel：“更多”，
headerMode:“屏幕”，
tabBarIcon:（{tintColor}）=>
}
}
},
//选项卡的默认配置
{
tabbar位置：“底部”，
animationEnabled：没错，
选项卡选项：{
指标类型：{
borderBottomColor:“#32a1fe”，
边框宽度：3
},
showLabel:true，
backBehavior：“无”，
showIcon：没错，
activeTintColor:#338AD8“，
颜色：“BEC5CB”，
大写标签：false，
labelStyle:[styles.labelStyle]，
}
}
);

这正是我正在使用的东西，但是TabNavigator没有被重置。我的场景是，每个选项卡都有一个选项卡导航器，每个选项卡都有自己的堆栈导航器。tab:4没有导航到登录屏幕（因为它不在第四个选项卡的堆栈导航器中），如果我将其包含在第4个选项卡的堆栈导航器中，则其他3个选项卡不会重置。当您尝试调度重置操作而不是导航操作时会发生什么情况？@PatNeedham是否有其他方法重置缓存或应用程序logout@Sau_Patil你在缓存中存储了哪些需要重置的内容？@PatNeedham我想将整个应用程序缓存重置为登录对于上面代码中提到的其他帐户，我得到以下错误：没有为keyTabView定义路由