Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

324
Vistas
React native/navigation error displaying component/component is undefined

I was a little bored of react-js recently and wanted to try react native, I followed a tutorial on youtube which used react navigation, and I got an error at the very beggining of creating my app (while creating my first component actually)

  • First I got an error saying Text strings must be rendered within a <Text> component. but my string was in a text component

  • Then I tried doing a component which just return en empty <View></View> but got an error :

variant Violation: View config getter callback for component `div` must be a function (received `undefined`) I concluded the error was coming from the component itself and not the text

  • Finaly I saw on a forum it could comme from a bad import, even if I was sure it was imported correctly I tried declaring my component inside my app.js so no import would be required, but the same errors happen

Here is my code :

import { createStackNavigator } from "@react-navigation/stack";
import { NavigationContainer} from "@react-navigation/native";
import { View } from "react-native-web";

const Stack = createStackNavigator();

const Home = () => {
  return (
    <View>
      <Text>Home</Text>
    </View>
  );
};


const App = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={Home} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

export default App;

In the tutorial I was following the guy used react navigation 6 but called the function createStackNavigator()

In the official documentation https://reactnavigation.org/docs/hello-react-navigation they use createNativeStackNavigator instead of createStackNavigator (which is for v5), I tried deleting my node modules, installing the correct npm package, verified the versions, and then followed this documentation but I still get the same errors

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You should be using createNativeStackNavigator instead, and you also need to import Text since you only have View. Be sure to import React Native components from 'react-native' instead of 'react-native-web'. Doing all of this fixed your issue and I can now see the text displayed:

import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { NavigationContainer } from "@react-navigation/native";
import { View, Text } from "react-native";

const Stack = createNativeStackNavigator();

const Home = () => {
    return (
        <View>
            <Text>Home</Text>
        </View>
    );
};

const App = () => {
    return (
        <NavigationContainer>
            <Stack.Navigator initialRouteName="Home">
                <Stack.Screen name="Home" component={Home} />
            </Stack.Navigator>
        </NavigationContainer>
    );
};

export default App;
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda