React Native Navigation Basic

Estee Tey

This is a standard way to declare the RootStackParamList type and create a navigator component that routes the different screens in a react native app.

import { createNativeStackNavigator } from "@react-navigation/native-stack";

type RootStackParamList = {
    Home: undefined;
    Checkout: undefined;
    Summary: undefined;
};
const RootStack = createNativeStackNavigator<RootStackParamList>();
const NavStack = () => (
    <RootStack.Navigator initialRouteName="Home">
        <RootStack.Screen name={"Home"} component={HomeScreen} />
        <RootStack.Screen name={"Checkout"} component={CheckoutScreen} />
        <RootStack.Screen name={"Summary"} component={SummaryScreen} />
    </RootStack.Navigator>
);