登录后,存在一个TabNav,从第一个选项卡导航到第二个选项卡,然后导航到StackNav中定义的屏幕,现在我想导航至TabNav的第三个选项卡。如何实现呢?我想从未发生的服务器中“获取”数据,因为未调用“ componentDidMount”。
当我不得不从TabNav导航到StackNav时,我遇到了同样的问题,但是我通过在StackNav中定义TabNav解决了它。
这是我的App.js
export class NavigationDrawerStructure extends Component {
toggleDrawer = () => {
this.props.navigationProps.toggleDrawer();
};
render() {
return (
<View style={{ flexDirection: 'row' }}>
</View>
);
}
}
const FirstActivity_StackNavigator = createStackNavigator({
First: {
screen: Screen1,
},
});
const Screen2_StackNavigator = createStackNavigator({
Second: {
screen: Screen2,
},
});
const Screen3_StackNavigator = createStackNavigator({
Third: {
screen: Screen3,
},
});
const TabNavigator = createMaterialTopTabNavigator(
{
Upcoming: { screen: UpcomingScreen },
Accepted: { screen: AcceptedScreen },
Ongoing: { screen: OngoingScreen },
Completed: { screen: CompletedScreen },
},
);
const tabs = createStackNavigator({
Root: {
screen: TabNavigator,
navigationOptions: () => ({
title: `Welcome, John Doe`,
}),
},
});
const AppNavigator = createStackNavigator(
{
login:
{
screen: Login,
navigationOptions: ({ navigation }) => ({
headerLeft: <NavigationDrawerStructure navigationProps={navigation} />,
headerStyle: {
backgroundColor: '#fff',
},
headerTintColor: '#fff',
}),
},
login: Login,
tab: tabs,
acceptedTrip: AcceptedTrip,
startTrip: StartTrip,
upload: Upload,
geoLoc: GeoLoc,
ongoingScreen: OngoingScreen
},
{
headerMode: 'none',
navigationOptions: {
headerVisible: false,
}
}
)
const DrawerNavigatorExample = createDrawerNavigator(
{
Screen1: {
screen: AppNavigator,
navigationOptions: {
drawerLabel: 'Login',
},
},
Screen2: {
screen: Screen2_StackNavigator,
navigationOptions: {
drawerLabel: 'Demo Screen 2',
},
},
Screen3: {
screen: Screen3_StackNavigator,
navigationOptions: {
drawerLabel: 'Demo Screen 3',
},
},
Screen4: {
screen: FirstActivity_StackNavigator,
navigationOptions: {
drawerLabel: 'Demo Screen 1',
},
},
},
{
initialRouteName: "Screen1"
}
);
const MyApp = createAppContainer(DrawerNavigatorExample);
class App extends React.Component{
render(){
return <MyApp/>
}
}
export default App
componentDidMount没有被调用。