Comment puis-je résoudre ce problème dans mon code React Native ? L'erreur indique "Erreur : type d'élément non valide : chaîne attendue (pour les composants intégrés) ou classe/fonction (pour les composants composites), mais non définie. Vous avez peut-être oublié d'exporter le composant à partir du fichier dans lequel il a été défini, ou Il peut y avoir une confusion entre les importations par défaut et nommées. Veuillez vérifier la méthode de rendu de TopNavigation
.”
J'ai essayé de redémarrer l'application et la machine mais cette erreur n'a pas disparu, quelqu'un peut-il m'aider à résoudre ce problème ?
这是我的导出方式:
importer { StyleSheet, View, Image } depuis 'react-native' importer React depuis 'react' importer le logo depuis '../../assets/Logo.png' ; importer {icons1, logo2} depuis '../Styles/styles' ; importer { Ionicons } depuis 'react-native-vector-icons' ; importer { Entypo } depuis 'react-native-vector-icons' ; exporter par défaut TopNavigation = ({ navigation, page }) => { retour (navigation.navigate('c')} /> { page === 'accueil' ? : } { page === 'profil' && navigation.navigate('paramètres')} /> } ) } 这是如何使用该组件的:
从 '../../Components/TopNavigation' et TopNavigation;
我的依赖项:
"dépendances" : { "@react-native-async-storage/async-storage" : "^1.17.11", "@react-native-community/geolocalisation" : "^3.0.5", "@react-navigation/native": "^6.1.3", "@react-navigation/native-stack": "^6.9.9", "@shopify/flash-list": "^1.4.1", "réagir": "18.2.0", « réaction native » : « 0,71,2 », "react-native-gesture-handler" : "^2.9.0", "contexte de zone de sécurité native de réaction" : "^4.5.0", "écrans-natifs-de-réaction": "^3.19.0", "icônes vectorielles réactives natives": "^9.2.0" },import { StyleSheet, View, StatusBar } depuis 'react-native'; importer React, { useEffect, useState, useCallback } depuis 'react' ; importer BottomNavigation depuis '../../Components/BottomNavigation' ; importer TopNavigation depuis '../../Components/TopNavigation' ; fonction d'exportation par défaut Accueil({ navigation }) { const [userdata, setUserdata] = useState(null); AsyncStorage.getAllKeys() .then((touches) => { clés.forEach((clé) => { AsyncStorage.getItem (clé) .then((valeur) => { console.log(`${key} : ${value}`); }) .catch((erreur) => { console.log(`Erreur lors de la récupération des données pour la clé ${key} : ${error}`); }); }); }) .catch((erreur) => { console.log(`Erreur lors de la récupération des clés : ${error}`); }); retour (); }
Je pense qu'il y a un problème dans le code du composant TopNavigation.
J'ai essayé le même code dans codesandbox et le problème semble provenir du composant Entypo.
Essayez de supprimer l'utilisation du composant Entypo et utilisez une autre solution de contournement à la place d'Entypo.
Essayez les solutions ci-dessous, j'espère qu'elles fonctionneront pour vous.
Par exemple :