问题标签 [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 投票
4 回答
16225 浏览

react-native - 如何在反应导航(3.x)中为全屏模式提供透明背景?

如何在反应导航(3.x)中为全屏模式提供透明背景。此处给出的解决方案不适用于新版本的反应导航。我想要在另一个屏幕上呈现的新全屏模式中的透明颜色。

虽然在“BrowserHome”组件上呈现的我的图像详细信息组件是:

0 投票
2 回答
78 浏览

react-native - 如何使 tabBarNavigator 的屏幕在 TabBar 上不可见?

我使用反应导航版本 3.x。如何使 tabBarNavigator 的屏幕在 TabBar 上不可见?

我需要从 tabBar 中删除主屏幕(它应该是不可见的)但 TabBar 必须在主屏幕上。

接下来是我的屏幕结构:

0 投票
1 回答
509 浏览

react-native - React Navigation (V2 / V3):如何在屏幕上的 navigationOptions 中访问 navigation.state.index

我正在构建一个 React Native 应用程序,对于我的导航,我使用 React Navigation (V3)。对于我的 UI 元素,我使用 React Native Elements。

我有一个屏幕,可以在多个导航器中重复使用。有时它位于堆栈的根部,有时它被堆栈推动。我想根据其在堆栈中的位置以编程方式将一个headerLeft元素添加到此屏幕navigationOptions,因为如果屏幕位于堆栈的根部,我要么希望显示默认的后退按钮,要么显示汉堡菜单图标(因为堆栈嵌套在抽屉中)。

所以我尝试了以下方法:

navigation.state.index问题是这在这里不起作用undefined。使用 React 导航如何做到这一点?

编辑: 根据要求,我添加了console.log(navigation)(通过<Icon />s的屏幕截图onPress。) 在此处输入图像描述

0 投票
1 回答
1181 浏览

react-native - 反应原生导航跨屏通知“snackbar”

尝试使用反应导航在反应本机的许多屏幕上实现“无互联网”通知。我试图避免将组件添加到所有屏幕视图渲染功能,因为它感觉就像样板。

有没有一种简单的方法可以使用反应原生导航在一个地方添加一个组件并让它在所有屏幕中持续存在?

0 投票
0 回答
122 浏览

react-native - 当我导航到另一个 BottomTabNavigator 时,如何确保完全删除抽屉导航?

我有一个 BottomTabNavigator ,其中包含另一个 BottomTabNavigator 和两个 DrawerNavigator 。

DrawerNavigators 之一表示经过身份验证的状态。我刚刚在此抽屉导航中实现了一个注销按钮。该按钮清除 redux 状态并导航到 BottomTabNavigator,更具体地说,导航到 Welcome 导航器的 Login 路由。

但是,一旦在注销后的 Welcome Navigato 中,当我尝试导航到 BottomTabNavigator 的另一条路线时,就会出现经过身份验证的 Drawer。

我不确定为什么会这样。当我刷新 expo 项目时,我意识到该应用程序确实处于未经身份验证的状态。

有没有办法确保在我注销时不会出现 Authenticated Drawer Navigator?

这是我的主要导航器:

0 投票
0 回答
554 浏览

reactjs - 用户登录页面后根据用户类型准备抽屉导航菜单

我们正在使用 createSwitchNavigator 为我们的应用程序创建 AppStack 和 Auth Stack

我们的开关组件看起来像

在 shell 中,我们正在创建动态抽屉菜单。初始应用程序将在我们有登录表单和忘记密码的地方加载 Auth Stack。

由于我们在 js 加载的 Header 中导入了 ShellForm,它会触发所有 const 变量并尝试获取菜单。

我们的外壳形式看起来像

由于 DrawerNav 是一个 const 变量,它试图准备菜单有没有办法实现这一点并避免预先加载。

有什么方法可以在登录完成后才开始呈现 ShellForm。

0 投票
1 回答
518 浏览

reactjs - 为什么我们有多个 stackNavigator?

例如这个用于身份验证的代码表单react-navigation 文档

为什么我们有两个不同的堆栈导航器?为什么我们不把所有的屏幕都封装到一个导航器中?在同一个导航器中包装不同屏幕的逻辑应该是什么?

0 投票
1 回答
110 浏览

react-native - React Navigation:切换到不同的堆栈并能够返回到上一个堆栈

例如,我有一个具有选项卡 A 和 B 的 BottomTabNavigator 堆栈。这两个选项卡本身就是包含以下路线的导航堆栈。

在任何时候,我的应用程序都应该能够将用户从任何路线(例如 B1 或 B2)导航到另一个堆栈的路线(例如 A1 或 A2)。我可以通过将路由 A1 和 A2 添加到 B 的堆栈来实现这一点,如下所示

我这样做是为了使同一堆栈树中的 B 可以使用 A 的路由。

尽管我能够做到这一点,但我希望能够导航回路线 B2(例如,如果我从 B2 导航到 A1)。但它没有发生;从 A1 路线按回。我不确定这是否是正确的方法。

我怎样才能控制导航并确保我回到我来自的上一个堆栈的路线。

0 投票
3 回答
1437 浏览

reactjs - 有没有办法动态地将新路由添加到 React 本机堆栈导航中

我们正在构建一个使用 React 本机堆栈导航的应用程序,取决于基于输出的 web api 调用,我们希望将重定向添加到具有不同数据的相同类型的屏幕,并且新屏幕可以创建另一个屏幕..

我们在应用程序开始时使用带有单个路由的堆栈导航。基于 Web Api 调用,我想向现有堆栈注入一个新路由,它应该能够返回到以前的屏幕

有什么办法可以做到这一点。?

0 投票
2 回答
2585 浏览

reactjs - 在反应导航bottomTabBarNavigation上隐藏特定选项卡

想象一下,我的标签栏有这样的结构:

我想在我的底部标签导航器中只显示三个标签(订单、趋势、热门销售),如何通过react-navigation3.x 版本实现它?

我想到的一个想法是,我创建了一个顶部stackNavigator并嵌套HomeStack在其中bottomTabNavigator,并将顶部的初始路线设置为stackNavigatorHome 但这种方法的问题是它不显示标签栏。