React Native 错误错误:元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件),但得到:未定义

ojsjcaue  于 2023-02-05  发布在  React
关注(0)|答案(1)|浏览(152)

我如何在我的react本机代码中修复这个问题错误说"ERROR错误:元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件),但得到:未定义。您可能忘记从定义组件的文件中导出组件,或者您可能混淆了默认导入和命名导入。请检查TopNavigation的呈现方法。"
我试图重新启动我的应用程序重新启动我的机器,但这个错误没有消失,有人可以帮助我解决这个问题吗?
以下是我的导出方式:

import { StyleSheet, View, Image } from 'react-native'
import React from 'react'
import logo from '../../assets/Logo.png';
import { icons1, logo2 } from '../Styles/styles';
import { Ionicons } from 'react-native-vector-icons';
import { Entypo } from 'react-native-vector-icons';

export default TopNavigation = ({ navigation, page }) => {

    return (
        <View style={page === 'home' ? styles.container : {
            flexDirection: 'row',
            alignItems: 'center',
            justifyContent: 'space-between',
            width: '100%',
            paddingVertical: 10,
            position: 'absolute',
            top: 0,
            zIndex: 100,
            backgroundColor: 'black',
        }}>
            <Entypo name="camera" size={24} color="black" style={icons1}
                onPress={() => navigation.navigate('c')}
            />
            {
                page === 'home' ? <Image source={logo} style={logo2} /> :
                    <Image />
            }
         
            {
                page === 'profile' &&
                <Ionicons name="settings-sharp"
                    size={24}
                    color="black"
                    style={styles.icons11}
                    onPress={() => navigation.navigate('settings')}
                />
            }
        </View>

    )
}

这是我使用的组件:import TopNavigation from '../../Components/TopNavigation';
<TopNavigation navigation={navigation} page={'home'} />
我的依赖关系:
x一个一个一个一个x一个一个二个x

jchrr9hc

jchrr9hc1#

我认为TopNavigation组件的代码中存在问题。
当我在codesandbox中尝试相同的代码时,问题似乎与Entypo组件有关。

尝试删除Entypo组件的使用,并使用另一个变通方案代替Entypo。

试试下面的解决方案,希望对你有用。
例如

import { StyleSheet, View, Image } from 'react-native'
import React from 'react'
import logo from '../../assets/Logo.png';
import { icons1, logo2 } from '../Styles/styles';
import { Ionicons } from 'react-native-vector-icons';
import { Entypo } from 'react-native-vector-icons';

export default TopNavigation = ({ navigation, page }) => {

    return (
        <View style={page === 'home' ? styles.container : {
            flexDirection: 'row',
            alignItems: 'center',
            justifyContent: 'space-between',
            width: '100%',
            paddingVertical: 10,
            position: 'absolute',
            top: 0,
            zIndex: 100,
            backgroundColor: 'black',
        }}>
            {
                page === 'home' ? <Image source={logo} style={logo2} /> :
                    <Image />
            }
         
            {
                page === 'profile' &&
                <Ionicons name="settings-sharp"
                    size={24}
                    color="black"
                    style={styles.icons11}
                    onPress={() => navigation.navigate('settings')}
                />
            }
        </View>

    )
}

相关问题