如何在react native中使用选项卡导航createBottomTabNavigator

npm install @react-navigation/native

npm install react-native-screens react-native-safe-area-context

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

const Tab = createBottomTabNavigator();

function HomeScreen() {
  // 页面内容
}

function ProfileScreen() {
  // 页面内容
}

function SettingsScreen() {
  // 页面内容
}

function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Home" component={HomeScreen} />
        <Tab.Screen name="Profile" component={ProfileScreen} />
        <Tab.Screen name="Settings" component={SettingsScreen} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

export default App;