React Native मा navigation कसरी काम गर्छ?

React Native मा navigation built-in छैन — standard solution React Navigation (एक लोकप्रिय library) हो जसले screens बीच सर्न दिन्छ। यसले navigators (stack, tabs, drawer) प्रदान गर्छ र navigation state, history, र transitions लाई सम्हालन्छ।

React Navigation — the standard library

text

Navigation isn't built into React Native → use REACT NAVIGATION (the de facto standard):
  → provides NAVIGATORS that structure how users move between screens:
    STACK navigator → push/pop screens (like a stack — forward/back, the most common)
    TAB navigator → bottom/top tabs (switch between sections)
    DRAWER navigator → a side drawer menu
  → handles navigation state, history (back stack), transitions, headers

Stack navigation example

jsx

// define screens in a stack navigator
const Stack = createNativeStackNavigator();
function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={DetailsScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

// navigate between screens (the navigation prop is passed to screens)
function HomeScreen({ navigation }) {
  return <Button title="Go to Details"
    onPress={() => navigation.navigate('Details', { itemId: 42 })} />;  // navigate + pass params
}

text

→ PARAMS — pass data when navigating: navigation.navigate('Details', { itemId: 42 })
  read in the target: route.params.itemId
→ navigation.goBack() — go back; the stack handles the back button automatically
→ Combine navigators (e.g. tabs containing stacks) for complex app navigation

React Native मा navigation कसरी काम गर्छ?

React Navigation — the standard library

Stack navigation example

Data पठाउनु र फिर्ता जानु

किन यो महत्त्वपूर्ण छ