reactjs - React Native Component Exception

Question

I got this error message while working on the other file

Error: Couldn't find a 'component', 'getComponent' or 'children' prop for the screen 'Store'. This can happen if you passed 'undefined'. You likely forgot to export your component from the file it's defined in, or mixed up default import and named import when importing.

my Store file - screen/Store.js:

import React from "react";
import {
    StyleSheet,
    SafeAreaView,
    View,
    Text,
    TouchableOpacity,
    Image,
    Animated
} from "react-native";
import { isIphoneX } from 'react-native-iphone-x-helper'

import { icons, COLORS, SIZES, FONTS } from '../constants'

const Store = ({ route, navigation }) => {
...
export default Store;

my Home file - screens/Home.js

import React from "react";
import {
    SafeAreaView,
    View,
    Text,
    StyleSheet,
    TouchableOpacity,
    Image,
    FlatList
} from "react-native";

import { icons, images, SIZES, COLORS, FONTS } from '../constants'

const Home = ({ navigation }) => {
...
export default Home;

my navigation file -navigation/tab.js:

import React from 'react';
import {
    View,
    Image,
    TouchableOpacity
} from 'react-native';
import { createBottomTabNavigator, BottomTabBar } from "@react-navigation/bottom-tabs"
import Svg, { Path } from 'react-native-svg';
import { isIphoneX } from 'react-native-iphone-x-helper';

import {Home, User} from '../screens'
import { COLORS, icons } from "../constants"
const Tabs = () => {
...
}

export default Tabs

and my App.js file in the main folder

import React from 'react';
import { createStackNavigator } from "@react-navigation/stack";
import { NavigationContainer } from '@react-navigation/native';

import { Store, OrderDelivery, User } from './screens';
import Tabs from './navigation/tabs';

const Stack = createStackNavigator();

const App = () => {
    return (
        <NavigationContainer>
            <Stack.Navigator
                screenOptions={{
                    headerShown: false
                }}
                initialRouteName={'Home'}
            >
                <Stack.Screen name="Home" component={Tabs} />
                <Stack.Screen name="Store" component={Store} />
                <Stack.Screen name="OrderDelivery" component={OrderDelivery} />
                <Stack.Screen name="User" component={User} />
            </Stack.Navigator>
        </NavigationContainer>
    )
}

export default App;

I understand what the message means but I dont get what did I do wrong and how to fix it, please help.

question from:https://stackoverflow.com/questions/65851777/react-native-component-exception

Answer 1

Are you sure you imported React in Store.js, try adding the import React from 'react';