I was setting up the navigations in my App.Js while encountered this error and I am completely clueless that how to solve this issue. Can someone help me?


And just pasting the code of App.Js
import * as React from 'react';
import { View, Text } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import Home from "../screens/Home";
import Login from "../screens/Login";
import Registeration from "../screens/Registeration";
function HomeScreen({ navigation }) {
return (
<View >
<Home />
<Button
title="Go to Login"
onPress={() => navigation.navigate('Login')}
/>
</View>
);
}
function RegisterationScreen({ navigation }) {
return (
<View >
<Registeration />
<Button title="Go to Home" onPress={() => navigation.navigate('Home')} />
<Button title="Go back" onPress={() => navigation.goBack()} />
</View>
);
}
function LoginScreen({ navigation }) {
return (
<View >
<Login />
<Button title="Go to Home" onPress={() => navigation.navigate('Home')} />
<Button title="Go back" onPress={() => navigation.goBack()} />
</View>
);
}
const Stack = createNativeStackNavigator();
function App() {
return (
<NavigationContainer>
<Stack.Navigator initialRouteName="Home">
<Stack.Screen
name="Home"
component={HomeScreen}
options={{ title: 'Home' }}
/>
<Stack.Screen
name="Registeration"
component={RegisterationScreen}
options={{ title: 'Registeration' }}
/>
<Stack.Screen
name="Login"
component={LoginScreen}
options={{ title: 'Login' }}
/>
</Stack.Navigator>
</NavigationContainer>
);
}
export default App;