Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.1k views
in Technique[技术] by (71.8m points)

react native - Remove screen from stack navigator

I’ve observed Back button logic works seeing the sequence of screens in the stack. I’ve a Drawer navigator placed inside stack navigator.

On top of the stack I’ve Splash screen. On Dashboard when I press back button it takes me to splash screen.

How can I remove splash screen from stack after entering in the app, So when I press back button Dashboard it will EXIT the app instead of taking to SPLASH SCREEN.

/* @flow */

import React from "react";
import { Platform, Text } from "react-native";
import { Root } from "native-base";
import { StackNavigator, DrawerNavigator} from "react-navigation";
import Register from "./components/Register";
import Available from "./components/Available";
import Splash from "./components/splash/“;
import SideBar from "./components/sidebar";
import Discover from "./components/Discover/";
import Dashboard from "./components/Dashboard/";
import Contact from "./components/Contact"



const Drawer = DrawerNavigator(
  {
    Dashboard: { screen: Dashboard },
    Discover: { screen: Discover },
    Contact: { screen: Contact},
      },
  {
    navigationOptions: {
      gesturesEnabled: false,
    },
   initialRouteName: "Dashboard",
    contentOptions: {
      activeTintColor: "#e91e63"
    },
    drawerPosition: 'right',
    contentComponent: props => <SideBar {...props} />
  }
);


const AppNavigator = StackNavigator(
    {
      Splash: { screen: Splash },
      Drawer: { screen: Drawer },                           
      Available: { screen: Available },
        Register: { screen: Register },
    },
    {
       //  initialRouteName: “Splash”,
         headerMode: "none",
    }
);

export default () =>
    <Root>
        <AppNavigator />
    </Root>;
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

One solution would be to reset the stack inside the splash screen component and redirect the user to the screen that you prefer:

import { NavigationActions } from 'react-navigation'

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

For newer versions of react-navigation :

import { StackActions, NavigationActions } from 'react-navigation';

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

Link to the official documentation


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...