新人使用react-navigation 请教



  • 现在我用一个需求,有个Login界面与一个MainTab界面(这个界面有4个界面)
    我的需求是 已登录状态时,用户一打开app 就直接进入MainTab界面
    如果是非登录状态 时,用户一打开app 就直接进入Login界面

    index.js

    import {AppRegistry} from 'react-native';
    import App from './App';
    import {name as appName} from './app.json';
    
    AppRegistry.registerComponent(appName, () => App);
    

    app.js

    import React, {Component} from 'react';
    import LaunchView from 'views/LaunchView/index';
    
    type Props = {};
    export default class App extends Component<Props> {
      render() {
        return (
          <LaunchView/>
        )
      }
    }
    

    LaunchView

    import React, {Component} from 'react';
    import Navigator from 'src/Components/Navigator/index';
    import Login from 'views/Login/index';
    
    export default class LaunchView extends Component {
    
      constructor(props){
        super(props)
        this.state={
          isLoading:true
        }
      }
    
      render() {
        return (
          this.state.isLoading ?
          <Login /> : <Navigator />
        )
      }
    
    }
    

    Navigator

    import { createStackNavigator } from 'react-navigation';
    
    import RouteConfig from 'src/Components/RouteConfig/index'
    import TabNavigator from 'src/Components/TabNavigator/index'
    const Navigator = createStackNavigator(RouteConfig, TabNavigator);
    
    export default Navigator;
    
    import MainTab from 'components/TabNavigator';
    import Login from 'views/Login/index';
    
    const RouteConfig = {
        MainTab: {
            screen:MainTab
        },
        Login: {
            screen: Login,
            navigationOptions: ({navigation}) => ({header: null, gesturesEnable: true})
        }
    }
    
    export default RouteConfig;
    

    MainTab

    export default MainTab = createBottomTabNavigator({
        // 配置TabNavigator
    })
    

    以上是我的react-navigation配置与相关逻辑 ,因为我的Login组件没有包含导航组件,所以在Login组件里要跳转到MainTab组件时,是不行的,那位大佬帮看下要怎么改





  • @晴明 非常感谢!!!!!