如何在自己的页面的底部导航的第一个标签页上具有顶部导航和底部导航？

Question

我有一个bottomTabNavigator和一个topTabNavigator，如果我单击底部导航的第一个选项卡，它将加载顶部导航的第一个选项卡。我想要的是让我的底部导航的第一个选项卡在单击时加载自己的页面，而顶部导航仍在那里。但是我如何做到这一点呢？

我已经尝试过几件事。

1. 在底部导航的第一个标签页上像组件一样渲染顶部导航。我得到的效果并不完全符合我的期望，但是它仍然会加载顶部导航的第一个选项卡。这是我不想要的，我希望底部导航（首页）的第一个标签具有自己的页面。
2. 在底部导航的第一个选项卡上加载底部和顶部导航，该导航会重定向到顶部导航的第一个选项卡。但是，然后让首页（这是底部导航的第一个选项卡）进入顶部导航，然后仅使此主页选项卡不可见。尽管我已经看到一些解决方法，但是我还没有让他们使用我的代码。

// This is my code, what I want is for Home in the bottom nav to go to the home page 
// and on the home page still have the bottom nav and top nav visible.
// How does the menu structure need to look like to make this happen?
export const HomeTop = createMaterialTopTabNavigator({
Introductie:{
 screen: Introduction
},
Blog:{
 screen: () => <NoAuth/>
},
 {...}
});
export const MiddleScreens = createBottomTabNavigator({
Home:{
 screen: HomeTop
},
{...}
});

我无法实现我想要实现的目标。另外，由于我目前对尝试其他方法一无所知。 我正在使用React Navigation V3。有没有更简单的方法可以实现？还是有适用于此版本的解决方法？

简而言之：我想在底部导航的第一个选项卡页面上具有顶部导航和底部导航，这是它自己的页面。

Answer 1

我猜选项卡在您的情况下不起作用。由于选项卡将默认为TabList的第一页。

一种解决方法是在顶部导航的第一页上有两个按钮和一个视图。

就这样

最初在视图上加载主页，一旦用户按下按钮1，则如果他按下按钮2则加载第二个Tab详细信息。

您可以使用状态标记来处理此问题。

希望有帮助。如有任何疑问，请随时澄清。