React Native Navigation 5-如何为每个底部选项卡设置颜色

npm install @react-navigation/native

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

const Tab = createBottomTabNavigator();

function App() {
  return (
    <NavigationContainer theme={{ colors: { background: 'white' } }}>
      <Tab.Navigator>
        {/* 在这里添加你的底部选项卡 */}
      </Tab.Navigator>
    </NavigationContainer>
  );
}

<Tab.Navigator
  screenOptions={({ route }) => ({
    tabBarStyle: { backgroundColor: 'blue' }, // 设置选项卡的背景颜色
  })}
>
  {/* 在这里添加你的底部选项卡 */}
</Tab.Navigator>

function HomeScreen() {
  return (
    // 在这里添加你的首页组件
  );
}

HomeScreen.options = {
  tabBarStyle: { backgroundColor: 'red' }, // 设置选项卡的背景颜色
};