in réactif ... J'essaie de lire la réponse retour de l'API et d'être indéfini, quel est le problème?
non défini se produit lors de l'appel de la fonction retrieveItems () code> du composant. P> **// component calling the item service**
import React from 'react'
import ItemService from "../Services/ItemService";
class Posts extends React.Component {
constructor(props) {
super(props);
}
componentDidMount = () => {
this.itemservice=new ItemService();
**console.log(this.itemservice.retrieveItems())**
}
render() {
return (
<h1>Posts List</h1>
);
}
}
export default Posts;
3 Réponses :
componentDidMount = () => {
this.itemservice=new ItemService();
this.itemservice.retrieveItems().then(res=>{
console.log(res);
}).catch(error=>{
console.log(error)
});
}
Le retour ajouté ne fera plus cela plus synchrone, n'est-ce pas?
Merci Aviya pour votre réponse, j'ai une question. Pouvons-nous dire que nous devons utiliser "alors" en cas de fonction d'appel qui contient un appel API?
@Devyaghi bien le puis est obligatoire en raison de l'appel AJAX. Je ne peux penser à aucun appel d'API qui ne serait pas AJAX depuis que cela gâcherait la demande toujours en attente d'une réponse du serveur. Donc, probablement, alors est nécessaire.
@ aviya.developer Merci beaucoup mon problème résolu
Comme je l'ai mentionné dans le commentaire, la méthode ou réécrivez-le à async / attendre pour une meilleure lisibilité maintenant dans votre journal de console que vous devez ne voyez pas la réelle réponse de l'appel d'API mais une promesse. Pour obtenir la réponse réelle, vous devez également attendre la réponse au côté de l'appelant: avec ceci, vous devez voir la réponse dans le journal de la console. retrieveItems ne renvoie pas de valeur. Pour résoudre ce retour, l'axios appelle
Le problème est le piège typique de vouloir renvoyer quelque chose à partir d'une fonction de rappel à la fonction extérieure. Cela ne peut pas fonctionner, car la fonction extérieure ( retriediems ) est déjà terminée. Vous devez rester dans le motif asynchrone. Le plus facile est probablement ce:
RetroveItem ne renvoie pas le résultat Axios. Gardez à l'esprit que c'est unprometteur il fonctionne de manière asynchrone