如何关闭其中包含多个屏幕的Reaction导航模式 [英] How to close a React Navigation modal with multiple screens in it

问题描述

我正在使用https://reactnavigation.org/在Reaction Native应用程序中导航，该应用程序以选项卡导航器为主堆栈，其中包含两个屏幕(用于登录和配置应用程序)。

我无论如何也想不出如何从第二个屏幕(SelectItems)关闭模式。从模式的第一个屏幕，我可以用navigation.goBack()关闭它。

两个模式屏幕都需要一个关闭按钮。是否有方法可以直接返回到用户所在的任何选项卡？

提前感谢您的帮助。

const Tabs = TabNavigator(
  {
    Search: { screen: Search },
    Settings: { screen: Settings }
  }
);

// modal with two screens
const Setup = StackNavigator(
  {
    Login: {
      screen: Login
    },
    SelectItems: {
      screen: SelectItems
    }
  },
  {
    initialRouteName: 'Login'
  }
);

const RootStack = StackNavigator(
  {
    Main: {
      screen: Tabs
    },
    Setup: {
      screen: Setup
    }
  },
  {
    mode: 'modal',
    headerMode: 'none'
  }
);

推荐答案

我找到了解决方案，但并不完美。

您可以使用popToTop，它将返回到堆栈的第一个场景，然后GoBack将关闭模式。

navigation.popToTop();
navigation.goBack(null);

问题是它会再次挂载堆栈的第一个场景，因此请确保不要在will mount或didmount中使用setState。或者阻止它。

这就是我目前使用的解决方案。我一直在寻找更好的解决方案。

这篇关于如何关闭其中包含多个屏幕的Reaction导航模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！