问题标签 [react-navigation-stack]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
527 浏览

javascript - React Navigation SwitchNavigator - 在多个堆栈之间导航

最近我不得不使用 React Navigation 重构我的 React Native App 中的导航。

事实上,我的应用程序中有几个导航器用于不同的目的:未连接时的屏幕、连接时的屏幕以及在两种情况下都应该可用的一些屏幕(例如使用条款)。

所以我的问题如下,如果我有这种模式,我如何例如从TermsOfUseto导航Register而不返回 to Welcome

我不能使用navigate.goBack(),或者navigation.navigate('Register')因为这些屏幕不在同一个屏幕中StackNavigator,并且在两个导航器中重复使用 TermsOfUse 会很脏。

0 投票
0 回答
622 浏览

ios - react-navigation 正在 iOS 模拟器上工作,但在 iOS 真实设备上面临导航问题

react - 导航适用于 iOS 和 android 模拟器以及 android 真实设备,但不适用于 iOS 真实设备

我正在使用堆栈导航器,在堆栈导航器内使用抽屉导航器和选项卡导航器,但在运行项目时,它正在 iOS 和 android 模拟器和 android 真实设备上工作,但在 iOS 真实设备上不工作

我正在使用“反应导航”:“^3.9.1”

0 投票
1 回答
2006 浏览

react-native - Stack Navigator 不显示屏幕

所以我一直试图让堆栈导航器工作。根据 console.log('Main') 我确实进入了主屏幕。这就是我想要的。但是,屏幕只是给我一个空白屏幕,只显示标题。我不知道问题是什么。我认为它可能与样式有关,但我已经删除并更改了它,似乎没有任何效果。我一直在导航的只是做 < ScreenName />。但这行不通,因为我也在尝试使用按钮进行导航。 登录主界面截图

我只想让主出现。

0 投票
1 回答
63 浏览

react-native - 底部选项卡中的条件

我从 React Native 开始,我在这里遇到了这个小问题。我有一个bottomTabNavigator,如果用户有权限,他导航到ImageScreen,否则,它导航到HomeScreen。

我的函数 global.hasPermission() 检查权限并返回 true 或 false,所以我希望能够根据函数返回的内容更改 {screen: ImageScreen}。我该怎么做?我在哪里调用我的函数 hasPermission()?

这是我的 tabNavigator:

0 投票
1 回答
1448 浏览

reactjs - createBottomTabNavigator 保持安装堆栈

我有一个带有两个堆栈(AuthStack 和 MainStack)的顶级 SwitchNavigator MainStack 包含已登录用户的堆栈。当我尝试从一个屏幕切换到另一个屏幕时很好,但是如果我开始一个改变当前屏幕状态的动作,如果我离开然后回来,状态保持不变,就像我没有卸载屏幕一样在其他人之间切换。

工作示例:https ://snack.expo.io/HJrslFk34

尝试移动到设置,点击“添加”,然后在屏幕之间切换,状态保持不变,屏幕没有被卸载

0 投票
1 回答
140 浏览

react-navigation - 导航回从一个堆栈到另一个堆栈的反应导航

有两种方法可以进入播放器屏幕。

  1. 您单击“更多”选项卡,其中包含“团队”链接,该链接显示所有可用的团队。然后您单击一个团队,它会将您带到 TeamStack。

在 TeamStack 中,默认是 Team Home,然后是一堆其他屏幕,其中一个是 Roster,其中列出了球队的所有球员。从那里您可以到达 PlayerStack,它会将您带到播放器主屏幕。

现在,当您进入球员屏幕时,您可以滑动返回,这会将您从您来的地方带回……到花名册,然后是球队主页,然后是更多页面。

到现在为止还挺好!

  1. 您单击链接到 StatsStack 的“Stats”选项卡。默认的 StatsStack 屏幕列出了领先排行榜的玩家。从那里你可以点击一个播放器。从那里您可以单击玩家的团队,这会将您带到 TeamStack。然后,您可以再次单击“名册”。如果你从那里回去,一切都会正常工作。回到球队主页,回到球员,回到统计数据。到目前为止,还不错!

这里是问题...

让我们回到 Stats 选项卡,然后单击一名球员,然后转到一个团队,然后转到名册。现在,如果你点击一个新球员,然后返回,它会直接返回到统计屏幕,而不是返回名册,然后是球队主页,然后是原来的球员,然后是统计。

不知何故,由于 PlayerStack 已经打开,当您从 Route 2 选项中的 Team Roster 中转到 Player 时,它会将您带回到最初打开的 PlayerStack,而不是向堆栈添加新屏幕。

这有意义吗?我该如何做,以便当您按照 Route 2 到达新玩家时,当您返回时,它会将您带回正确的屏幕顺序?

0 投票
5 回答
4328 浏览

react-native - React Navigation:透明标题没有高度

如果我设置headerTransparent: true通常在下方呈现的其他内容,它会在其下方移动。我怎样才能避免这种情况?

我的代码:

带有透明标题(它重叠:():

在此处输入图像描述

没有透明标题:

在此处输入图像描述

我想让内容对齐,就好像标题有高度一样。所以我希望内容像第二张图片一样,但有一个透明的标题,就像第一张一样。

0 投票
5 回答
8028 浏览

react-native - 反应导航 headerBackImage 不起作用

我在我的 React Native 应用程序中使用 React Navigation 3.11,我想自定义堆栈导航中的后退按钮。在文档中它说:

headerBackImage

反应元素或组件以在标题的后退按钮中显示自定义图像。当一个组件被使用时,它在渲染时会收到一些道具(tintColor, title)。默认为带有 react-navigation/views/assets/back-icon.png 后退图像源的 Image 组件,这是平台的默认后退图标图像(iOS 上的人字形和 Android 上的箭头)。

这是我的配置:

我的配置中还有其他页面,所有页面都具有相同的共享导航选项和自定义标题背景图像。但是,在我的应用程序中,它呈现默认的后退箭头。(headerBackTitleVisible: false虽然确实有效)

我究竟做错了什么?

0 投票
6 回答
27320 浏览

react-native - React Native 从导航堆栈中清除上一个屏幕

我正在开发一个用于学习目的的 React 本机应用程序。我现在正在使用 React Navigation 实现导航。我正在使用堆栈导航。但我找不到从导航历史记录中删除前一个屏幕并终止应用程序的方法。

我这样设置导航。

正如您在上面的代码中看到的,我默认打开登录屏幕。登录后,我像这样打开“事件”屏幕。

问题是,当我在事件页面上时,我可以在导航栏中看到后退按钮。当我按下它时,我被带回了登录页面。

但我想要的是,登录后,我想从堆栈中删除登录页面。当我在事件页面上时,当我单击后退按钮时,应用程序应该关闭。也许它可能没有后退按钮。在这种情况下,它就像第一个屏幕一样。我怎样才能做到这一点?

0 投票
1 回答
1048 浏览

react-native - 在反应导航中打开抽屉时如何移动tabBar

我在我的应用程序中都使用了 TabNavigator 和 DrawerNavigator。

当我使用“滑动”选项打开抽屉时,内容会随抽屉滑动,但 TabBar 不会一起滑动。

在此处输入图像描述

我想让 TabBar 一起滑动,但我找不到任何选项。

我怎样才能做到这一点?你能帮忙吗?

- - - - - - -[代码] - - - - - - - -

1) 应用程序.js

2)tabBar.js

3) SlideMenu.js

4) 带抽屉的屏幕