더북(TheBook)

9.1 탭 화면 구현하기

앞에서 MainTab 컴포넌트를 만들었지만, 실제로 탭은 아직 구현하지 않았습니다. 이번에는 createBottomTabNavigator를 사용해 탭을 구현해줍시다. 기존에 MainTab에서 작성한 코드는 모두 지우고 다음과 같이 코드를 작성해주세요.

screens/MainTab.js

import React from 'react';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';

const Tab = createBottomTabNavigator();

function MainTab() {
  return (
    <Tab.Navigator
      screenOptions={{
        headerShown: false,
        tabBarShowLabel: false,
        tabBarActiveTintColor: '#6200ee',
      }}>
      {/* TODO: 화면 추가 */}
    </Tab.Navigator>
  );
}

export default MainTab;
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.