React native 从堆栈导航器中删除屏幕

我已经观察到后退按钮逻辑在堆栈中看到屏幕的顺序。我在堆栈导航器中放置了一个抽屉导航器

在堆栈顶部，我有一个启动屏幕。在仪表板上，当我按下“后退”按钮时，它会将我带到启动屏幕

进入应用程序后，如何从堆栈中删除闪屏，这样当我按下“返回”按钮Dashboard时，它将退出应用程序，而不是进入闪屏

/* @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>;

/*@flow*/
从“React”导入React；
从“react native”导入{Platform，Text}；
从“本机基”导入{Root}；
从“反应导航”导入{StackNavigator，DrawerNavigator}；
从“/components/Register”导入寄存器；
可从“/components/Available”导入；
从“/components/Splash/”导入飞溅；
从“/components/SideBar”导入侧栏；
从“/components/Discover/”导入发现；
从“/components/Dashboard/”导入仪表板；
从“/components/Contact”导入联系人
const Drawer=付款人(
{
仪表板：{屏幕：仪表板}，
发现：{屏幕：发现}，
联系人：{屏幕：联系人}，
},
{
导航选项：{
手势已启用：错误，
},
initialRouteName：“仪表板”，
内容选项：{
activeTintColor:#e91e63
},
抽屉位置：'对'，
contentComponent:props=>
}
);
const AppNavigator=StackNavigator(
{
飞溅：{screen:Splash}，
抽屉：{屏幕：抽屉}，
可用：{屏幕：可用}，
寄存器：{屏幕：寄存器}，
},
{
//初始路由名称：“飞溅”，
headerMode:“无”，
}
);
导出默认值（）=>
;

一种解决方案是重置启动屏幕组件内的堆栈，并将用户重定向到您喜欢的屏幕：

import { NavigationActions } from 'react-navigation'

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

对于较新版本的

反应导航

：

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

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

我用

代码：

const prevGetStateForActionHomeStack = HomeStack.router.getStateForAction;
HomeStack.router = {
  ...HomeStack.router,
  getStateForAction(action, state) {
    if (state && action.type === 'ReplaceCurrentScreen') {
      const routes = state.routes.slice(0, state.routes.length - 1);
      routes.push(action);
      return {
        ...state,
        routes,
        index: routes.length - 1,
      };
    }
    return prevGetStateForActionHomeStack(action, state);
  },
};
replaceScreen = () => {
  const { locations, position } = this.props.navigation.state.params;
  this.props.navigation.dispatch({
    key: 'NearMeMap',
    type: 'ReplaceCurrentScreen',
    routeName: 'NearMeMap',
    params: { locations, position },
  });
};

此外，如果您需要深入解释代码，请观看此短片

您还可以触发此onPress，如：

onPress={()=>navigation.reset({
    index:0,
    routes:[
      {
        name:"NameOfScreen",
      //  params:{key:'param'},
      },
    ],
  })}

---

在react navigation 5.x版本中。如果要打开新屏幕并删除以前的堆栈屏幕，可以编写：-

navigation.dispatch(StackActions.replace('screen_name', {params: {}}));

replace操作允许在导航状态下替换路线。您可以将其导入为：-

import { StackActions } from '@react-navigation/native';

如果要在堆栈导航上执行其他操作，请签出此链接-

---

但这样做不会从堆栈中删除闪屏。我想在返回仪表板时退出应用程序，而不是导航到其他屏幕的闪屏。此代码将擦除所有历史记录，因此闪屏不再是堆栈的一部分。您提供的链接无效，能否提供指向d的固定链接文档上述链接对版本3无效，请使用此解决方案@EhsanZargarErshadi更新了我对更新版本的react navigation的回答。看起来自去年以来，有些事情发生了变化。因此我的回答仍然有效

import { StackActions } from '@react-navigation/native';