CODEWITHSUNDEEP
react-nativeexpo
Justin
Justin

Reputation: 473

How to set first Initial Page on React-Native

I am now using the Expo-cli for react-native developing Since I am gonna set my first page as Homepage but now it is setted as login page

import * as React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import Splash from './pages/splash';
import AuthLogin from './pages/auth/Login';
import AuthRegister from './pages/auth/Register';
import AuthRecoverPassword from './pages/auth/RecoverPassword';
import Home from './pages/home/home'
import Profile from './pages/profile/profile'

const Stack = createStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator
        screenOptions={{
          headerShown: false,
        }}>
        <Stack.Screen name="Splash" component={Splash} />
        <Stack.Screen name="Home" component={Home} />
        <Stack.Screen name="AuthLogin" component={AuthLogin} />
        <Stack.Screen name="AuthRegister" component={AuthRegister} />
        <Stack.Screen
          name="AuthRecoverPassword"
          component={AuthRecoverPassword}
        />
        <Stack.Screen name="Profile" component={Profile} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

Also hope you to let me know about the Stack.screen feature.

Upvotes: 2

Views: 8593

Answers (1)

Wen W
Wen W

Reputation: 2647

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator
        initialRouteName='Home' ///the name of the initial screen
        screenOptions={{
          headerShown: false,
        }}>
        <Stack.Screen name="Splash" component={Splash} />
        <Stack.Screen name="Home" component={Home} />
        <Stack.Screen name="AuthLogin" component={AuthLogin} />
        <Stack.Screen name="AuthRegister" component={AuthRegister} />
        <Stack.Screen
          name="AuthRecoverPassword"
          component={AuthRecoverPassword}
        />
        <Stack.Screen name="Profile" component={Profile} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

Upvotes: 3

Related Questions