reactjs 从屏幕B导航到A时防止卸载

aemubtdh 于 2023-05-17 发布在 React

关注(0)|答案(1)|浏览(133)

所以我的问题是：当使用React Navigation时，当用户导航到屏幕A时，A被挂载。当用户转到屏幕B时，B被装载，A保持装载。当用户导航回A时，B变为未装载，但A保持装载。
根据文档，这是预期的。
我想让B站起来。这可能吗？如果是，那么如何？

const ThisStack = createStackNavigator(
  {
    A: {
      screen: ScreenA,
      navigationOptions: ({ navigation }) => ({
        headerLeft: <HamburgerMenuButton navigation={navigation} />,
      }),
    },
    B: {
      screen: ScreenB,
    },
  },
  {
    initialRouteName: 'FOO',
    headerMode: 'screen',
    defaultNavigationOptions: navigationOptions,
  }
);

为什么要安装此文件？
我必须使用一个名为Reactive的软件包。Reactive有一个名为<ReactiveComponent />的基本组件，当卸载时，它会调用一个removeComponent函数，我试图防止这种情况发生。
看起来Reactive并不是为了在不同的屏幕上使用而创建的，但是为了实现我想要完成的目标，我需要以这种方式使用它。

reactjs

来源：https://stackoverflow.com/questions/55637229/prevent-unmounting-when-navigating-from-screen-b-to-a

1条答案

按热度按时间

mwg9r5ms1#

这很简单。您当前使用的是StackNavigation，它的工作原理是将屏幕安装在彼此的顶部，并在不再需要它们时将其卸载。另一方面，如果您只是想在不同屏幕之间导航而不卸载它们，则可以选择许多其他导航选项。例如，TabNavigation、DrawerNavigationSwitchNavigator等。或者您甚至可以使用react-navigation构建自己的navigator。
这里我使用switchNavigator，它经常用于身份验证流程，即登录用户或注销用户。

const ThisStack = createSwitchNavigator(
  {
    A: {
      screen: ScreenA,
      navigationOptions: ({ navigation }) => ({
        headerLeft: <HamburgerMenuButton navigation={navigation} />,
      }),
    },
    B: {
      screen: ScreenB,
    },
  },
  {
    initialRouteName: 'FOO',
    headerMode: 'screen',
    defaultNavigationOptions: navigationOptions,
  }
);

我所做的只是简单地使用createSwitchNavigator而不是createStackNavigator。让我知道这对你是否有效

赞(0）回复(0）举报 2023-05-17

我来回答

reactjs 从屏幕B导航到A时防止卸载

1条答案

相关问题

热门标签

最新问答