0

我需要知道它是否能够使用 react-native 实现我想要的行为。

我正在尝试找到一种方法来导航到从一个静态定义的屏幕多次创建的特定屏幕。首先通过以下方式创建多个屏幕：

   this.props.navigation.push('tabScreen') // option 1

   this.props.navigation.navigate({routeName: 'tabScreen', params: {}, key: uuid()}) // option 2

我能够使用 stackNavigator 成功创建多个相同的屏幕，但问题是我需要能够导航或“跳转（不仅仅是返回上一个屏幕）”到创建的任何屏幕，而无需卸载创建的屏幕.

例如，如果我有屏幕 1、屏幕 2、屏幕 3、屏幕 4、屏幕 5，我应该能够跳转或导航

Screen 1 -> Screen 4
Screen 4 -> Screen 2
Screen 2 -> Screen 5

等等，而无需在导航时卸载屏幕（移动浏览器中选项卡功能的确切行为）。

React-naivgation 的堆栈导航器使用堆栈，因此据我了解，它会在导航到屏幕之前弹出所有屏幕，因此会卸载屏幕。

在 react-native 的导航库中可以实现这种行为吗？

如果不是，我应该在哪里或如何解决问题？

谢谢

4

1 回答 1

1

您可以使用ViewPager来实现此行为：请参考ViewPager 例如

对于您的选项卡，您应该必须创建选项卡数组，并且在此基础上，您可以使用迭代或任何其他机制将选项卡作为视图分页器内的视图进行管理。

对于动态添加视图，您可以将新选项卡添加到数组中，并且可以重新渲染视图分页器组件。

对于 Navigation，您可以使用不同的事件处理 API 方法onPageScrollStateChanged, onPageScroll ，例如管理选项卡切换和其他内容。

我希望这能回答你的问题。

于 2020-01-08T06:56:04.940 回答