Question simple: j'essaie de naviguer à partir de Cependant, lorsque j'appuie sur l'image, une erreur apparaît: Quel est le problème avec la navigation?
Ceci est le code principal de HomeCreen.js à MessagesScreen Une fois appuyé sur le HomeCreen.js L'image de l'en-tête. app.js
3 Réponses :
Vous devez passer des accessoires à votre fonction, sinon il n'a aucun moyen de savoir ce que cette "navigation" est, essayez quelque chose comme ou ceci? p> headerRight: (props)=>
<TouchableOpacity
onPress={() => props.navigation.navigate("MessageScreen")}>
<Image
source={require("./assets/message.png")}
style={{width: 40,height: 40, borderRadius: 40 / 2}}/>
</TouchableOpacity>
J'ai essayé les deux méthodes, mais je reçois 'TypeError: Undefined n'est pas un objet (évaluer' ProPs.Navigation.Navigation.navigate ')
Désolé alors. Eh bien, vous pouvez essayer d'utiliser un crochet de consommation. Mais cela ne semble pas que vous utilisiez la navigation rn 5
J'utilise RN 4.3. Je suis un peu nouveau pour réagir comme natif, alors pourquoi devrais-je utiliser rn 5 à la place?
5 est une nouvelle version de la navigation de réaction. Il est beaucoup plus simple d'utiliser et ajoute une tonne de fonctionnalités qui vous aideraient certainement à vous aider. Par exemple, ce crochet «usenavigation» que vous pouvez simplement passer à n'importe quel composant React et utiliser simplement la navigation sans les accessoires qui passent. Mais réécrivez la navigation dans toute la navigation pour résoudre ce problème, c'est survenir probablement.
Eh bien, c'était ce que je pensais maintenant. Je devrais commencer presque tout avec mon application pour résoudre ce petit problème: \, ça ne vaut tout simplement pas la peine pour le moment.
Ce n'est pas comme si vous avez à ovverwite toute votre application. Ma compagnie, nous avons fait la même chose et nous avons eu une assez grande partie de basebase déjà. Vous n'avez pas à supprimer vos composants de réaction ou quoi que ce soit. Il m'a fallu ~ 2 jours pour réécrire notre application et pousser une nouvelle version. Cela valait vraiment la peine à long terme.
Avez-vous essayé d'utiliser: ou apps.navigation.navigate ("MessagesScreen") ?
Oui, je l'ai fait, et je reçois 'TypeError: Undefined n'est pas un objet (évaluer' apps.navigation.navigate.navigate ')
Essayez ceci:
const HomeStack = createStackNavigator({
HomeScreen: {
screen: HomeScreen,
navigationOptions: ({navigation}) => {
return {
headerShown: true,
title:'As minhas viagens',
headerTintColor:'black',
headerRight: () =>
<TouchableOpacity onPress={() => navigation.navigate("MessageScreen")}>
<Image
source={require("./assets/message.png")}
style={{width: 40,height: 40, borderRadius: 40 / 2}}/>
</TouchableOpacity>
}
})
},
MessageScreen: {
screen: MessageScreen,
navigationOptions: () => ({
headerShown: true
})
}
});
Merci, ça a fonctionné! J'aimerais vraiment que je voudrais maintenant, pourquoi dois-je coder "retour" comme des enfants d'options de navigation?
Les accolades après () => {} sont lus comme un bloc de fonction et non comme un bloc d'objet. Donc, le compilateur pense que vous venez d'écrire quelques propriétés dans un bloc au lieu de retourner un objet réel.