Navigation error with React Native

Asked

Viewed 69 times

0

I’m developing an application in React Native with three types of browsing: Drawer, Bottom Tab and Stack Navigator. I entered these three types of navigation but shows the following error:

inserir a descrição da imagem aqui

He says I have two "Navigationcontainer" but there is only one in my application. Does anyone know what I can do in this case? Follow code below:

function Drawer(){
return(
    <AppDrawer.Navigator
    drawerContent={(props) => <CustomDrawer {...props} />}
    drawerStyle={{
        backgroundColor: '#0e28cc'
    }}
    drawerContentOptions={{
        labelStyle: {
            fontWeight: 'bold'
        },
        activeTintColor: '#fff',
        inactiveTintColor: '#ddd',
        activeBackgroundColor: '#0e9dcc',
        inactiveBackgroundColor: '#0e9dcc',
        itemStyle: {
            marginVertical: 5
        }

    }}
    >
        <AppDrawer.Screen name="Editar Perfil" component={EditPerfil} />
    </AppDrawer.Navigator>
)

}

function Tabs(){
return(
    <Tab.Navigator
    screenOptions={({route}) => ({
        tabBarIcon: ({color, size}) => {
            const {} = icons[route.name];
            return <Icon name={name} color={color} size={size} />
        }
    })}
    tabBarOptions={{
        style: {
            backgroundColor: '#121212'
        },
        activeTintColor: '#fff',
    }}
    >
        <Tab.Screen name="Home" component={Home}/>
        <Tab.Screen name="Formulário" component={Form}/>
        <Tab.Screen name="Perfil" component={Perfil}/>
    </Tab.Navigator>
)

}

export default function AppRoutes(){
return(
    <NavigationContainer>
        <Stack.Navigator>
            <Stack.Screen name="Home" component={Tabs} options={{headerShown: false}}/>
            <Stack.Screen name="Editar Perfil" component={Drawer} options={{headerShown: false}}/>
        </Stack.Navigator>
    </NavigationContainer>
)

}

  • You installed the React-natvigation library and did import correctly? import { Navigationcontainer } from '@React-navigation/Native';

  • Yes, it is installed and import is correct.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.