在我的情况下,如何使用createSwitchNavigator从注销导航到登录屏幕


const RootNav = createStackNavigator(
  {
    Splash: {
        screen:Splash
    },
    BeforeLogin: {
        screen:BeforeLogin
    },    
    Signin: {
        screen:Signin
    },
    Tabs: {
        screen:TabHolder
    },
    ForgotPassword: {
        screen:ForgotPassword
    },
    Signup: {
        screen:Signup
    },
  },
  {
      headerMode:'none',
      mode:'modal', 
  }
);
export default class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  render() {
    return (
        <RootNav />
    );
  }
}

索引是最初调用的主类。

// Below is the TabHolder Screen which is created in RootNav
import { createBottomTabNavigator, createStackNavigator } from 'react-navigation';
const ProfileMainTab = createStackNavigator({
      Profile: {
          screen:Profile
      },
      EditProfile: {
          screen:EditProfile
      },
      FollowersList: {
          screen:FollowersList
      },
      Following: {
        screen:Following
      },
      FollowersRequest: { 
          screen:FollowersRequest
      },
      Settings: {
          screen:Settings
      },
      Settings2: {
          screen:Settings2
      },
      Payment: {
          screen:Payment
      },
      CreditCard: {
          screen:CreditCard
      },
      VisaCard: {
        screen:VisaCard
      },
      Messaging: {
          screen:Messaging
      },
      TopRanking: {
        screen:TopRanking
      },
      WorldTopRank: {
          screen:WorldTopRank
      },
  },
  {
      headerMode:'none',
      mode:'modal'
  }
);
const HomeMainTab = createStackNavigator({
     Home: {
       screen: Home,
     },
     SharePicture: {
       screen: SharePicture,
     },
     OtherProfile: {
       screen: OtherProfile,
     },
    },
     {
      headerMode:'none',
      mode:'modal'
     }
);
const TabNav = createBottomTabNavigator ({
  HomeMainTab: {
      screen: HomeMainTab,
      navigationOptions: {    }
    },
    Search: {
      screen: Search,
      navigationOptions: {    }
    },
    AddPost: {
      screen: AddPost,
      navigationOptions: {    }
    },
    FollowersList: {
      screen: FollowersList,
      navigationOptions: {    }
    },
    ProfileMainTab: {
      screen: ProfileMainTab,
      navigationOptions: {    }    
  },{
      tabBarPosition: 'bottom',
      animationEnabled: true,
      swipeEnabled: true, 
  }
);
export default class TabHolder extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  render() {
    return (<TabNav/>)
  }
}

我的"设置"屏幕中有一个注销按钮。所以现在当我单击"注销"时,我想导航回"登录屏幕"。但我无法导航回来。如何使用 createSwitchNavigator 解决我的问题?请帮忙。我也无法使用 this.props.navigation.navigate('Signin'); 从注销按钮导航。

我想

问题出在导航道具上。

为什么需要这样做?

export default class TabHolder extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  render() {
    return (<TabNav/>)
  }
}

它创建一个 React 本机组件,其中导航需要导航对象

所以请尝试export default TabNav

最新更新