问题标签 [react-navigation-drawer]

我正在尝试将图标添加到以下简单的React Navigation DrawerNavigator：

抽屉显示正常，但图标不是。

我正在导航到一个用参数包裹在 DrawerNavigator 中的 StackNavigator（其默认路由是 MaterialBottomTabNavigator）。我可以在 Drawer 自定义组件中获取参数。但在 StackNavigator 的屏幕中无法获得相同的结果。我尝试通过将默认路由更改为纯屏幕来避免 BottomTabNav，但结果仍然相同。

这是我的仪表板屏幕 - 选项卡导航器

这是我从上述选项卡之一导航到的另一个屏幕

因此，这是一个包含两者的堆栈导航器

我需要一个抽屉来放整件东西，所以把它全部包起来

抽屉在哪里

对于身份验证和其他东西，如飞溅，我正在使用

现在我想做的是这个。

• 在“Splash”，我检查最后一个用户信息。
  • 如果我得到它，我会验证会话令牌以查看它是否已过期
    • 如果没有过期，我会使用 userinfo 导航到“App”（上面的 AppDrawerNavigator 实例）
  • 如果我没有得到它，或者会话已过期，我会导航到 Auth
    • 身份验证结束后，我使用用户信息导航到“App”（上面的 AppDrawerNavigator 实例）

在任何一种情况下，我都将使用相同的 userinfo 参数来“应用”，并且我可以在 Drawer component 中获取 userinfo 参数。

但我没有从 AppStack 中的任何其他屏幕获取它。我什至试图通过将Otherscreen 向上移动到第一个位置使其成为默认值来避免中间的BottomTabNav，然后导航到“App”转到Otherscreen，但userinfo 参数仍然不可用。

我想我应该能够从（A）抽屉组件和（B）AppStack屏幕上的this.props.navigation获取userinfo参数，或者至少它是初始屏幕，即仪表板组件

这是一个最小的演示： https ://github.com/bhave-abhay/PassPropsIntoNestedNav/ 另外，这是错误报告 https://github.com/react-navigation/react-navigation/issues/5646

在这种情况下出了什么问题？！

编辑：异步调用现在已放置在axios.all()调用中以加快进程。问题仍然相同。

在我的应用程序中，当在登录屏幕上按注销时，存储在设备上的令牌被删除。

登录.js：

现在我想在另一个页面中使用这个事实，我将渲染基于 prop loggedIn。如果已登录，那么true，我将呈现活动以及一个绿色或红色框，指示用户是否已注册该活动。这一切都很简单，并且工作正常：

但是，当用户刚刚注销时，不应显示此信息。在这种情况下，它应该显示一个简单的文本，上面写着“您必须登录才能查看活动”。

为简单起见，省略了registered、notRegistered和onOpenFood和函数的渲染。onOpenActivity对于刷新的功能和 API 调用，我有这段代码（API 调用的功能在单独的文件中，这些是基本的 axios 请求，两者都是GET和POST）：

现在的问题是，this.state.registered重新打开页面时看不到更改，导致页面显示不正确。刷新页面有效，因为整个状态都被重置了。如何解决这个问题？有没有办法例如onRefresh在再次加载页面时调用？页面以及函数onOpenFood和onOpenActivity导航到的页面是 StackNavigator 的一部分，StackNavigator 本身也是 DrawerNavigator 的一部分（react-navigation 3.3.2）。

在我的抽屉导航器中，当我按下注销时有注销按钮。我想删除app_token，但我不知道如何删除。

我试着把这样的东西：

但它没有用。

});

我一直在尝试构建一个应用程序，它会在启动后进入登录屏幕。用户登录后，应将其定向到具有抽屉导航和选项卡的屏幕。我一直在尝试使用 react native expo 来实现这一点。它在世博会工作得很好。但是，一旦我生成了一个 APK 并尝试使用它，登录后它会重定向到启动和登录，而不显示任何内容。我一直在使用 react-navigation 包在屏幕之间导航

我的 Navigator.js：

我的 MainDrawer.js：

我的 SplashScreen.js：

我的 LoginScreen.js：

有人可以指出问题出在哪里并提出修复建议吗？提前致谢。

当我第一次启动该应用程序时，它快速且响应迅速。但是当我导航时，它变得越来越慢。即使我递归地在主屏幕和第二屏幕之间导航。第一次导航是即时的，但第 10 次已经需要一秒钟，整个应用程序变得越来越慢。我怀疑导航是原因。因为如果我什么都不做。该应用程序刚刚运行，在我开始导航之前它很快。这发生在规模更大的android上。在 iOS 上（至少在模拟器上）这个问题在经过大量导航后才稍微明显。

据我了解，每次我导航到某个地方时，都会在堆栈顶部添加新屏幕。我所有的导航都是这样制作的。props.navigation.navigate('Home')，有时带有道具。所以也许这就是原因。如果是，有没有办法在我每次返回主屏幕时重置堆栈？

这是我的 Navigator.js

我有另一个带有一个登录屏幕的导航器来显示用户是否未登录。但我认为这无关紧要。

这是我的 HomeScreen.js 的内容

仅供参考，设置屏幕，它完全是空的

在这两个屏幕之间来回导航每次都变得越来越慢。

TL;DR：我需要这个结果（下面列出了 DrawerNavigator 和 StackNavigator 导航）：

结构：

我有这样的屏幕结构：

在根页面（由“•”表示）中，我需要使用DrawerNavigator进行导航，而子页面（由“|_”表示）需要使用StackNavigator进行导航。

这是我想要得到的行为：

抽屉：带 => createDrawerNavigator() 的MainDrawer

切换导航器：

组件：StartCheck和WelcomeScreen是一个<Component />

StartCheck：这只是检查 AsyncStorage 上是否有数据，例如“isFirstRun”，并根据结果打开WelcomeScreen或MainDrawer [like this documentation]。

我的代码：

屏幕：

主抽屉：

带有 SwitchNavigator 的应用容器：

有了这段代码，Header就不会出现了，所以我把 DrawerNavigator 放到 StackNavigator 里面：

主栈：

我用 SwitchNavigator 修改了 App Container：

但是通过这种方式，标题与侧边栏重叠，如果我使用headerMode: 'none'，我的标题也会从其他屏幕上消失（不仅仅是容器）。

我需要这个结果（上面有 DrawerNavigator 和 StackNavigator 导航列表）：

而且我也不知道在哪里可以放置辅助屏幕（使用 StackNavigator 的导航方法打开）。

很抱歉这个大帖子，是我试图尽可能详细，因为我一直在寻找解决方案，但我没有找到......

对于学校作业，我们正在使用 React Navigation 和 Redux 创建一个 React Native 应用程序。因为我们所有人都是新手，所以我们有一个无法解决的问题。

我们希望在单击某个按钮时更改标题的标题。我们第一次单击按钮时，它会很好地更改标题标题。当我们按下不同的按钮时，问题就出现了，标题不会改变。请注意，无论我们选择什么选项，我们总是会转到同一个屏幕。

当我们将标题栏放在 DrawerNavigator 中时，我们确实让它工作了，但是因为我们希望 Drawer 来自标题，所以这不是一个选项。我的猜测是，堆栈是用某个标题创建的，并且在使用 DrawerNavigator 切换屏幕时永远不会更新，但我们不知道如何解决这个问题。

提前致谢！

我有一个使用 React-Navigation 3.x 构建的主屏幕。我有一个标题、一些导航图标和一个底部选项卡菜单。它运行良好，但现在我想在屏幕上添加一个抽屉菜单，并在右上角添加一个图标来切换抽屉。

这是我的主屏幕（App.js）的简化版本：

这是 DrawerMenu.js 的代码

我无法让抽屉工作。当我单击主屏幕右上角的“菜单”按钮调用 toggleDrawer() 时，出现“未定义不是对象（评估 'ae.props.navigation'）”错误。

抽屉也无法使用手势激活，所以我认为我没有正确添加它。我在这里做错了什么？谢谢！！

我们正在为我们的 React Native 应用程序使用 React Navigation 并显示侧栏。一切正常，但是，关闭抽屉不起作用。

实际上，当用户点击 Android 设备后退按钮时，我必须关闭抽屉。

所以，我navigation.closeDrawer();在后退按钮处理程序方法中调用。

但是，虽然我们试图通过设备后退按钮侧抽屉不关闭来关闭。 OpenDrawer方法工作正常。

我的侧边栏中有许多屏幕。那么，在每个类中我需要调用这个 closeDrawer 方法还是我们可以调用它的任何一个全局类？如果抽屉打开，我只需要关闭，如果用户点击设备后退按钮，我必须关闭这个抽屉。

有什么建议么？