Отображение TabBar на экране DrawerNavigator

В настоящее время у меня есть эта структура:

const Tabs = TabNavigator({
  Home: {screen: Home},
  Store:{screen: Store}
  More: {screen: More,
    navigationOptions: {
      tabBarLabel: 'More',
      tabBarIcon: <Entypo name='dots-three-horizontal' size={25}/>,
      header: null
      },
    }
  },
  {
  initialRouteName: 'Home',
  tabBarPosition: 'bottom',
  navigationOptions: ({ navigation }) => ({
            tabBarOnPress: (scene, jumpToIndex) => {
                if (scene.route.routeName === "More") {
                  navigation.navigate('DrawerToggle')
                }
                else{
                  jumpToIndex(scene.index);
                }
            },
        }),
      },
    )


const Drawer = DrawerNavigator(
  {
   Tabs: {screen: Tabs,
     navigationOptions: {
           drawerLabel: () => null
      }
   },
   Profile: {screen: Profile},
   Search: {screen: Search}
  },
  {
   initialRouteName: 'Tabs',
   headerMode: 'none',
   drawerPosition: 'right'
  }
)


export const Root = StackNavigator(
  {
  LoginScreen: {screen: Login},
  Drawer: {screen: Drawer},
 },
  {
   initialRouteName: 'LoginScreen'
  }
)

Все отлично работает. Когда я нажимаю (например) «Профиль», страница загружается нормально, а когда нажимаю «Дополнительно», открывается меню ящика.

Функциональность, которую я хотел бы достичь, заключается в том, что я хотел бы показать TabBar внутри страницы «Профиль» (экран DrawerNavigator). Как это возможно?


react-native reactjs stack-navigator react-navigation tabnavigator
person Nikasv    schedule 04.12.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward 

const Drawer = DrawerNavigator(
  {
   Profile: {screen: Tabs},
   Search: {screen: Search}
  }

Вы можете вложить навигатор в другой навигатор. Навигатор вкладок — это компонент, и вы можете использовать этот компонент как «экран» для другого навигатора.

Навигатор - это компонент. И экран должен быть компонентом.

person suark_krab    schedule 05.12.2017
comment
Эй, спасибо за ответ, но экран профиля должен быть профилем (страницей профиля), а не вкладками. Я добавил экран «Профиль» в Tabnavigator, и при нажатии «Профиль» в DrawerNavigator меня перенаправляют на страницу профиля. Я вижу TabBar ниже (это то, к чему я стремился изначально), единственная проблема, с которой я столкнулся, заключается в том, что я хотел бы скрыть вкладку «Профиль» от TabBar. - person Nikasv; 06.12.2017