问题标签 [react-navigation-drawer]

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 投票
0 回答
842 浏览

react-native - React-Navigation - DrawerNavigator 中带有后退按钮的标题

我觉得我的导航设置一团糟,我无法实现我想要的。

我有一个StackNavigator服务于一些页面一个DrawerNavigator处理一些其他页面一个BottomTabNavigator

大多数事情都有效,但似乎我不能在通过Drawer

这是我的代码,并带有一条评论,其中似乎没有处理我想要的内容:

我究竟做错了什么?

0 投票
3 回答
30817 浏览

android - 如何在 React Navigation 中的 Stack Navigation 中添加抽屉

我正在做一个像登录/注册应用程序这样的练习项目,我正在使用 react-navigations 中的 Stack Navigation,它运行良好,

现在,当用户登录时,他应该被重定向到仪表板屏幕,我希望在标题右侧有一个抽屉“我还添加了一个屏幕截图”,并且我也在堆栈导航中创建了仪表板屏幕我不知道如何添加堆栈导航中的那个抽屉我只想在我的仪表板屏幕上使用抽屉,所以任何人都可以提供帮助 谢谢

这就是我想在仪表板屏幕上看到的内容

App.js(我在其中添加了所有堆栈屏幕)

仪表板.js

0 投票
0 回答
916 浏览

react-native - 在 React Native Navigation Drawer 中添加部分/分隔符

我有一个使用 React Navigation Drawer 的 React Native 项目,使用自定义抽屉组件:

是否可以添加分隔器来制作抽屉物品的部分?我想把我的一半物品放在一个部分,另一半放在另一个部分,用分隔线分开。

我知道可以创建自定义抽屉条目,以便在按下时导航到某些页面,但在这种情况下,我不能使用诸如“activeBackgroundColor”之类的样式。

0 投票
4 回答
13402 浏览

react-native - withNavigation 只能用于导航器的视图层次结构

我收到错误:

Invariant Violation:withNavigation 只能用于导航器的视图层次结构。被包装的组件无法从 props 或 context 访问导航

我不知道为什么,因为我withNavigation在我的应用程序的其他组件中使用它并且它有效。我看不出它所作用的组件与导致错误的组件有什么不同。

代码:

组件:

堆栈导航器:

在这里,我渲染了StackNavigatorMenu的应用程序组件中的内容:

和我的根组件:

我已将我的 Vepo 组件更改为此以实现 vahissan 的答案:

没有错误,但 alertModal 不再显示

0 投票
2 回答
2042 浏览

react-native - 将本机设置状态从抽屉导航器反应到其他组件

在第一个屏幕上,我有一个包含一些产品列表的组件,比如 ProductListing.js。在抽屉导航器上,我有一些复选框。当我单击导航器的任何复选框时,我想设置 ProductListing.js 的状态。

应用程序.js

路由器.js

SideMenu.js

ProductListing.js

现在单击 SideMenu.js 中的 handleChange,我想在 ProductListing.js 中更新 GradesFilter 的状态,我正在更新我的产品列表。

0 投票
3 回答
6754 浏览

react-native - 打开/关闭导航抽屉在本机反应中不起作用

在我的 react native 应用程序中,我使用 Drawer Navigator 创建了一个侧边菜单,当我通过滑动打开它时它运行良好。但我想做的是在单击按钮时打开它。目前我正在尝试做槽导航道具,相关代码如下:

但是当我点击侧面菜单按钮时,它会被点击,但之后什么也没有发生。

0 投票
1 回答
7775 浏览

react-native - React Native Navigation 重新加载 Stack Navigator 主屏幕

我遇到了一个问题,我基本上不知道如何继续前进。

我有一个带有两个屏幕的 StackNavigator,一个称为“HomeScreen”,另一个称为“SettingsScreen”。当我点击一个按钮时,我会进入“SettingsScreen”。

我还有一个 DrawerNavigator,我可以用它导航到四个屏幕之一,屏幕 4 是 StackNavigator。

(希望它是可以理解的)

所以让我们来解决问题......
我的问题是我的“SettingsScreen”具有将项目添加到 AsyncStorage 键的功能(它将它推送到数组,所以最后我有一个列表,我在“HomeScreen”上呈现),但是当我添加项目并返回我的“主屏幕”时,它不会重新加载页面。我怎样才能使它在满足某些条件甚至更简单时重新加载页面 - 每次离开“SettingsScreen”时如何重新加载页面?

0 投票
1 回答
323 浏览

react-native - 无法从导航堆栈中导航到路由。

我有一个包含整个导航堆栈的文件。在我的导航标题中,我有一个菜单,我想打开一个抽屉。现在在这个例子中我得到了错误:Cannot read property 'navigation' of undefined

我的 AppNavigation 文件:

问题似乎在这里结束了:

然后在我的 App.js 我有

反应导航的版本是 2.18.1

谢谢

0 投票
0 回答
334 浏览

reactjs - 如何从子抽屉导航转到父堆栈导航屏幕

我的应用程序上有抽屉导航和堆栈导航。

然后我打电话给

我的问题是,当我单击抽屉按钮内的注销时,我需要路由到 OnBoarding 组件。但怎么可能呢? 在此处输入图像描述

请帮我解决这个问题或建议我一个更好的主意,因为我是这个堆栈的新手。谢谢你。

0 投票
0 回答
120 浏览

javascript - 带有 React Navigation 的 Drawer Navigation 屏幕上的选项卡

我得到了一个非常复杂的应用程序布局,而且我对 React Native 还是新手,所以我很困惑。

目前我有一个在 App.js 中调用的路由器文件。

基本上,每个页面上的布局都需要是选项卡和抽屉,但我有一些页面仅通过 DrawerNavigator 引用,因此它们在这些页面上没有选项卡。基本上在下面的代码中,我需要可以从抽屉导航访问“UserCreate”堆栈,但也需要在页面上有选项卡。

我尝试将 Drawer 和 Tabs 嵌套到另一个 StackNavigator 中,但这似乎不起作用。有人有想法么?