CODEWITHSUNDEEP
react-nativeexporeact-native-navigation
Pepopig
Pepopig

Reputation: 65

expo React native navigation, screen stuck at default logo

import React, {Component} from 'react'    
import Registrar from './pantallas/Registrar'; //register screen
import Principal from './pantallas/Principal'; // main screen after login    
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from "@react-navigation/native-stack";

export default function App()  {
  
  const Stack = createNativeStackNavigator(); 
  
  return(
    
  <NavigationContainer >
      
      <Stack.Group
        initialRouteName="Registrar"
        screenOptions={{ headerShown : false }}>            
        <Stack.Screen name="Registrar" component={Registrar} />            
        <Stack.Screen name="Principal" component={Principal} />          
      </Stack.Group>
    
    </NavigationContainer>
  )   
};

Upvotes: 0

Views: 494

Answers (2)

Piotrek Jazz
Piotrek Jazz

Reputation: 1

I had the same problem when I didn't install all packages required for navigation. It worked locally but stucked as apk file.

The documentation recommends you first install: npm install react-native-gesture-handler then ensure the first import at the top of your App.js (or similar) is import 'react-native-gesture-handler';

And you will need to optionally install masked view if you are using UIKit style animations: npm install @react-native-masked-view/masked-view

Also note that you need to ensure that your pods are linked - while this happens automatically in later versions of react, you may need to run this command to link them: npx pod-install ios

Upvotes: 0

Corey Sutton
Corey Sutton

Reputation: 1015

If you haven't already, make sure you install react-native-gesture-handler and import it. Please see the stack-navigator docs for more info: stack-navigator

From the docs: "To finalize installation of react-native-gesture-handler, add the following at the top (make sure it's at the top and there's nothing else before it) of your entry file, such as index.js or App.js: import 'react-native-gesture-handler';"

Another thing I recommend is to use @react-navigation/stack rather than native-stack. Native stack causes issues when navigating between screens, whereas stack is known to be smoother and easier to use. The docs will explain everything.

Please reply if you have further issues.

Upvotes: 1

Related Questions