我有一个React Native应用程序导航逻辑,类似于这个navigation structure(抽屉、标签、堆栈)。
抽屉导航器包含底部标签导航器,底部标签导航器包含堆栈导航器。
当我在某个嵌套最深的组件上时,我想禁用我的左抽屉(完全停用其标题)。
Level 0
const App = () => {
return (
<NavigationContainer>
<DrawerNavigation />
</NavigationContainer>
);
};
Level -1
const DrawerNavigation = (props: Props) => {
const Drawer = createDrawerNavigator();
return (
<Drawer.Navigator
useLegacyImplementation
initialRouteName="GlobalTabNavigation"
>
<Drawer.Screen
name="GlobalTabNavigation"
component={BottomTabNavigation}
/>
</Drawer.Navigator>
);
};
Level -2
const BottomTabNavigation = () => {
const Tab = createMaterialTopTabNavigator();
return (
<Tab.Navigator
initialRouteName="HomeStack"
tabBarPosition="bottom"
backBehavior="initialRoute"
>
<Tab.Screen
name="HomeStack"
component={HomeStackScreen}
/>
<Tab.Screen
name="DownloadsStack"
component={DownloadsStackScreen}
/>
<Tab.Screen
name="Wipe"
component={WipeScreen}
/>
</Tab.Navigator>
);
};
Level -3
const HomeStackScreen = () => {
const Stack = createStackNavigator();
return (
<Stack.Navigator initialRouteName="Home">
<Stack.Screen name="Home" component={HomeComponent} />
<Stack.Screen name="RlsACOptions" component={RlsACOptionsComponent} />
</Stack.Navigator>
);
};
Level -4
const RlsACOptionsComponent = () => {
return (
// My Stuffs
);
};
字符串
现在,在我的子级别-4组件RlsACOptionsComponent中,我想停用我的级别-1 Drawer标题。
如何让我的抽屉检测到这种深度的路线?
祝你好运
我知道getFocusedRouteNameFromRoute可以向下1级,但是向下2级、3级、4级呢?
我用的是React Navigation v6 x。
1条答案
按热度按时间acruukt91#
使用onStateChange监听导航状态的变化,并更新应用程序状态以隐藏/显示组件。类似这样:
字符串