在用户通过身份验证后，如何导航用户登录屏幕？

Question

我有一个根StackNavigator，它有另外两个导航器1堆栈导航器（登录，注册）2选项卡导航器（主页，配置文件，设置）

所以当用户登录成功时，如何从root Navigator导航到tabNavigator？

import React from 'react';
import { createStackNavigator, createAppContainer } from 'react-navigation'

import authNavi from './AuthRoute';  /// this is StackNavigator with login signup screen

import appNavi from './AppRoute' /// this is tabNAvigator with profile home setting screen

const RootRoute = createStackNavigator({ 

    auth: {screen: authNavi },
    app: {screen: appNavi }
})

const RootNavi = createAppContainer(RootRoute);
export default RootNavi;  /// this is rootNavigator whih is rendered in App.js

here is the image of App.js and RootRouter

Answer 1

您可以通过以下方式从auth堆栈导航到tabNavigator：

this.props.navigation.navigate('app');

建议我认为你用SwitchNavigator替换你的主StackNavigator ...因为在用户连续登录之后，你不需要他们再次访问你的auth流。

Answer 2

通过使用Switch Navigator，您可以实现此目的。

从createSwitchNavigator进口react-navigation

例如：

import {
  createAppContainer,
  createStackNavigator,
  ...
  createSwitchNavigator
} from "react-navigation";

之后添加开关导航器。

...
const switchNavigator = createSwitchNavigator(
  {
    LoginStack: authNavi,
    AppTabs: appNavi
  },
  { headerMode: "none", initialRouteName: "LoginStack" }
);

const App = createAppContainer(switchNavigator);

export default App;

当你想换回家时，请使用它

this.props.navigation.navigate("AppTabs");

它会将导航切换到标签栏导航。