Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6214

React Navigation v5 Disable Option Menu

$
0
0

I am trying to achieve an disabled (not hidden) specific option menu item from the sidebar (navigation drawer). I went over the official docs, but didn't find any answer how to achieve it. Did any one manage to do it via the DrawerItemList ?

Here is the code snippet:

<NavigationContainer linking={linking}><Drawer.Navigator          drawerStyle={{width: 0.85 * width}}          initialRouteName="Home"          drawerContentOptions={{            activeTintColor: 'gray',          }}          drawerContent={(props: DrawerContentComponentProps) => {            const {user} = this.props.userStore;            return <DrawerContent {...props} user={user} />;          }}><Drawer.Screen            name="Home"            component={Home}            options={{drawerLabel: 'Home', drawerIcon: HomeIcon}}          /><Drawer.Screen            name="Companies"            component={CompanyList}            options={{              drawerLabel: 'Companies',              drawerIcon: CompaniesIcon,            }}          /><Drawer.Screen            name="Members"            component={Profile}            options={{              drawerLabel: 'Members',              drawerIcon: MembersIcon,            }}          /><Drawer.Screen            name="Programs"            component={Profile}            options={{drawerLabel: 'Programs', drawerIcon: ProgramsIcon}}          /><Drawer.Screen            name="MyNetwork"            component={Profile}            options={{              drawerLabel: 'My Network',              drawerIcon: MyNetworkIcon,            }}          /><Drawer.Screen            name="Inbox"            component={Profile}            options={{drawerLabel: 'Inbox', drawerIcon: InboxIcon}}          /><Drawer.Screen            name="Holdings"            component={Profile}            options={{drawerLabel: 'Holdings', drawerIcon: HoldingsIcon}}          /><Drawer.Screen            name="Support"            component={Profile}            options={{              drawerLabel: 'Support',              drawerIcon: SupportIcon,            }}          /><Drawer.Screen name="Profile" component={Profile} /></Drawer.Navigator></NavigationContainer>

DrawerContent.tsx

interface DrawerProps extends DrawerContentComponentProps {  user: User | null;}function DrawerContent(props: DrawerProps): JSX.Element {  const secondaryText = '#61616A';  return (<Container><Content contentContainerStyle={styles.content}><DrawerContentScrollView          contentContainerStyle={{paddingTop: 36}}          {...props}><DrawerItemList            {...props}            itemStyle={{              marginStart: 0,              marginEnd: 0,              paddingStart: 36,            }}          /></DrawerContentScrollView></Content></Container>  );}export default DrawerContent;

Viewing all articles
Browse latest Browse all 6214

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>