我只是想使用react-navigation v5嵌套2个主要的顶部标签导航器。父级标签导航器工作正常,但其第二个屏幕(这是我的第二个顶部标签导航器)无法正常工作。在父级顶部选项卡导航器的结构中,我有2个屏幕,screen1和子级顶部选项卡导航器作为屏幕2。但是,以某种方式,当我滑动到第二个屏幕即子级导航器时,无法在screen3和screen2之间切换在里面。当我尝试转到screen3时,将其带回子标签导航器中的screen2。
在这里您可以看到我的代码:
const Theater = createMaterialTopTabNavigator();
const Theater2 = createMaterialTopTabNavigator();
const screen1 = ({ route }) => (
<View style={{ flex: 1, backgroundColor: "red" }} />
);
const screen2 = ({ route }) => (
<View style={{ flex: 1, backgroundColor: "yellow" }} />
);
const screen3 = ({ route }) => (
<View style={{ flex: 1, backgroundColor: "purple" }} />
);
const TheaterStack2 = (props) => {
return (
<Theater2.Navigator>
<Theater2.Screen name="home2" component={screen3} />
<Theater2.Screen name="detail2" component={screen2} />
</Theater2.Navigator>
);
};
const TheaterStack = (props) => {
return (
<Theater.Navigator>
<Theater.Screen
name="home"
component={screen1}
initialParams={{
item: props.data,
type: "theater",
self_link: props.data.self_link,
}}
/>
<Theater.Screen name="detail" component={TheaterStack2} />
</Theater.Navigator>
);
};