https://reactnavigation.org/docs
항상 공식문서 확인하면서 할 것
npm install @react-navigation/native
expo install react-native-screens react-native-safe-area-context(expo사용시)
npm install react-native-screens react-native-safe-area-context
npm install @react-navigation/bottom-tabs
npm install @react-navigation/native-stack
bottom과 stack는 필수이니 같이 settiggka.
1.Tab Navigation
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'
const Tab = createBottomTabNavigator();
const Tabs = () => {
return (
<Tab.Navigator>
<Tab.Screen name="Home" component={HomeScreen} />
<Tab.Screen name="Settings" component={SettingsScreen} />
</Tab.Navigator>
);
}
2. Native Stack
import { createNativeStackNavigator } from '@react-navigation/native-stack';
const Stack = createNativeStackNavigator();
const Stacks = () => {
return (
<Stack.Navigator>
<Stack.Screen name="Home" component={Home} />
<Stack.Screen name="Notifications" component={Notifications} />
<Stack.Screen name="Profile" component={Profile} />
<Stack.Screen name="Settings" component={Settings} />
</Stack.Navigator>
);
}
*Stack과 NavtiveStack은 차이점이 거의 없다고 보면됨.
Thanks its a great and best idea for more you can visit site: https://www.castlesapp.com/best-vpns-for-castle-app/