我是 React Native 的新手，正在研究 React Navigation 5。在 React Navigation 4 中，在 createAppContainer 的幫助下，我們可以導入導航組件并在 app.js 中調(diào)用它。我們怎樣才能用 React navigation 5 做同樣的事情呢？這是我的代碼//drawer Componentimport AccountsScreen from "../screens/AccountsScreen";import CategoriesScreen from "../screens/CategoriesScreen";import FavouritesScreen from "../screens/FavouritesScreen";import HomeScreen from "../screens/HomeScreen";import SettingsScreen from "../screens/SettingsScreen";import TrendsScreen from "../screens/TrendsScreen";import { MaterialCommunityIcons } from "@expo/vector-icons";const Drawer = createDrawerNavigator();const AppDrawer = () => { return ( <NavigationContainer> <Drawer.Navigator initialRouteName="Home" drawerContentOptions={{ activeTintColor: "#555", }} > <Drawer.Screen name="Home" component={HomeScreen} options={{ drawerIcon: ({ focused, color, size }) => ( <MaterialCommunityIcons style={{ fontSize: size, color: color }} name={focused ? "home" : "home-outline"} /> ), }} /> <Drawer.Screen name="Accounts" component={AccountsScreen} /> <Drawer.Screen name="Categories" component={CategoriesScreen} /> <Drawer.Screen name="Trends" component={TrendsScreen} /> <Drawer.Screen name="Favourites" component={FavouritesScreen} /> <Drawer.Screen name="Settings" component={SettingsScreen} /> </Drawer.Navigator> </NavigationContainer> );};export default AppDrawer;//App.jsimport React from "react";import "react-native-gesture-handler";import { createDrawerNavigator } from "@react-navigation/drawer";import AppDrawer from "./route/AppDrawer";const Drawer = createDrawerNavigator();export default function App() { return <AppDrawer />;}
我們?nèi)绾卧诹硪粋€組件中創(chuàng)建抽屜導航并在 app.js 中調(diào)用它
瀟瀟雨雨
2023-07-29 16:40:21
