问题标签 [react-navigation-bottom-tab]

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 回答
655 浏览

react-native - 我们如何在反应导航中点击底部选项卡导航器上的相应选项卡按钮时实现滚动到顶部功能?

我使用的 React Navigation 版本是 v5。在与底部选项卡图标对应的 ScrollView 中,如果用户已经在该给定屏幕上,我想启用在按下此图标时用户滚动到顶部的功能。

0 投票
0 回答
144 浏览

react-native - 反应导航5 - 底部选项卡活动borderTopColor

我正在使用createBottomTabNavigator,而不是在选项卡处于活动状态时为整个选项卡或图标着色,我只想更改borderTopColor。这有可能吗?

0 投票
1 回答
576 浏览

react-native - 材料底部选项卡上的 ScrollView 不起作用

当前行为

我正在创建这样的选项卡(注意:主页是 StackNavigator 屏幕):

碳 (3)

ProfileTab 以这种方式呈现(项目是输入数组):

所有输入都遵循以下结构:

碳 (4)

目前有这种行为(不滚动):

ezgif com-video-to-gif (1)

预期行为

滚动应该正常工作。我还使用 react-native-gesture-handler 的 ScrollView 进行了测试,但它也不起作用。

0 投票
1 回答
1382 浏览

react-native - 使用 React Navigation 为每个底部选项卡添加后退按钮

底部标签导航看起来像这样:

收藏夹和搜索屏幕上没有返回按钮。我想这是正常行为,但我很想拥有一个。

除了重新创建一个看起来像本机后退按钮的组件并使用 headerLeft 在某些屏幕上添加它之外,我在文档中没有找到相关的内容。有没有更简单的方法?

0 投票
0 回答
42 浏览

react-native - React navigation and loading component in react native

Hello I have a react component like which either display a list of items or opens another component which allowes me to select some value. Here is the code

My issue is that when I come to this tab, I want to reset the list which came from server and then open the school selector again, which I am doing in handleTabFocus. But there I have to first call

  1. this.props.resetClassList();
  2. this._openChildSchoolSelector()

The issue is that this._openChildSchoolSelector() is called while this.props.resetClassList() hasn't fininshed.

this.props.resetClassList() works like this

it calls an action like this

which then cleans the classlist like this

in ClassListReducer.js

and also in ChildrenSelectionRedcuer.js

Any hints to solve this? My project uses very old React navigation v1

One thing which I did was to use this

But not sure if this is an elegant way of doing this

0 投票
1 回答
170 浏览

reactjs - 如何使用 Top Navigator 和 Bottom Navigator 而不让 Top Navigator 与 React Navigation 中的状态栏重叠?

我正在尝试在反应导航中将顶部导航器嵌套在底部导航器中。但是,当我这样做时,顶部导航器会与状态栏发生冲突。我假设这是因为底部导航器将其向上推。但是我怎样才能让两个导航器都出现在状态栏旁边呢?下面是重叠问题的图像。我正在使用反应导航 5,任何其他解决方案都使用我尝试过但不起作用的旧版本。

顺便说一句,如果需要该信息,我将在 iPhone 11 上对此进行编码。

在此处输入图像描述

0 投票
1 回答
312 浏览

react-native - onPress 在不导航的屏幕上导航

我是 React Native 的初学者,当我按下屏幕的 时,我想在屏幕上导航,ButtonNavigator它不起作用。

因为当我按下没有发生我不明白Button的事情时TabOneStack.Screen,我想导航到TabTwoScreen. 我使用 React Navigation 5.6.1。

为什么当我按下按钮时TabOneStack.Screen什么都没有发生?

先感谢您

0 投票
1 回答
350 浏览

reactjs - 如何在标签导航中访问导航道具 - 反应导航

我需要在所有屏幕中出现一个浮动按钮,我将它放在具有绝对位置的底部选项卡导航器中,但我无法为其设置 onPress 导航..如何在选项卡导航器中访问 navigation.navigate?

我的代码

0 投票
1 回答
2171 浏览

reactjs - 如何使用组件内的按钮更改选项卡

最初的免责声明,我是 react/react-native 和 Expo 的新手,所以我的代码目前不是最好的。

所以,我有一个带有按钮的类组件,它在我的应用程序的 2 个不同屏幕中使用,我希望该按钮更改当前选项卡。

在我的 App.js 中,我正在创建一个底部标签栏,如下所示:

}

在主屏幕内,我有一个内部有一个 Touchable 的组件,该组件用于将选项卡更改为名为“搜索”的选项卡。

这是主屏幕

具有 Touchable 的组件是这个:

所以我的问题是,如何在按下组件中的 Touchable 后更改我所在的选项卡?我已经尝试过这个解决方案,但它不起作用。

提前感谢!

0 投票
1 回答
2103 浏览

react-native - 如何隐藏特定屏幕上的底部标签栏(反应导航 5.x)

我想知道如何从堆栈导航器中的特定屏幕隐藏底部标签栏,我的代码如下。我只想隐藏播放器屏幕的底部选项卡,或者使用模式打开播放器屏幕有人可以帮助我吗?

这是我的主标签导航器的代码

这是我的主堆栈导航器的代码

这是我用于将数据发送到要隐藏的页面的页面的堆栈导航器的代码

在这里我想隐藏这个屏幕的标签栏