Как добавить элементы ящика Dynami c в Reaction-Navigation V5? - PullRequest
Новая
       23

Как добавить элементы ящика Dynami c в Reaction-Navigation V5?

1 голос
/ 23 марта 2020

Я пытаюсь добавить ящик динамического c в свое приложение. 

function CustomDrawerContent(props) {
  return (
    <SideMenu/>
  );
}

function DrawerStack() {
  return (
    <Drawer.Navigator
      initialRouteName="Home"
      drawerStyle={{
        backgroundColor: '#ffffff',
        width: metrices.DEVICE_WIDTH * 0.7,
      }}
      drawerContent={props => <CustomDrawerContent {...props} />}
      >
      <Drawer.Screen name="Home" component={Home} />
    </Drawer.Navigator>
  );
}

Как и в предыдущей реагирующей навигации, контент-компонента отсутствует. поэтому я сделал это в соответствии с официальными документами о реактивной навигации. но не могу получить динамическое c sidemenu.

1 Ответ

0 голосов
/ 23 апреля 2020

Ваше SideMenu должно выглядеть следующим образом:

Каждая строка будет DrawerItem, у вас есть пример с официального сайта. 

import {
  DrawerContentScrollView,
  DrawerItemList,
  DrawerItem
} from '@react-navigation/drawer'

function DynamicList(props) {
    const { elements } = props 
    return elements.map(element => (
        <DrawerItem
            key={emenet.key}
            label={element.label}
            onPress={element.onPress}
        />
    ))
}

function SideMenu(props) {
  return (
    <DrawerContentScrollView {...props}>
      <DrawerItemList {...props} />
      <DrawerItem
        label="Help"
        onPress={() => Linking.openUrl('https://mywebsite.com/help')}
      />

      {/* Here you can add as many as DrawerItems you want */}

      <DynamicList />
    </DrawerContentScrollView>
  );
}
...