Comment résoudre l'erreur « TypeError : this.setState n'est pas une fonction » dans React lors de l'appel d'API tierces ?

Erreur React "this.setState n'est pas une fonction" : un guide complet

Lorsque vous travaillez avec des API tierces dans des applications React, vous pourriez rencontrer l'erreur « TypeError : this.setState n'est pas une fonction ». Ce problème est dû à un malentendu courant sur la façon dont les rappels sont gérés en JavaScript.

Comprendre le problème

L'erreur se produit lorsque vous essayez d'accéder au mot clé this dans un rappel fonction définie dans un composant React. La fonction de rappel est invoquée dans un contexte différent, ce qui pointe vers le mauvais objet. Par conséquent, React ne trouve pas la méthode setState à ce sujet.

Solution : liaison au contexte parent

Pour résoudre ce problème, vous devez lier cette valeur du composant parent à la fonction de rappel. Cela garantit que le rappel a accès au bon this, qui contient la méthode setState.

Exemple : liaison aux appels init et API

Dans l'extrait de code fourni , vous devez lier les appels VK.init et VK.api à la valeur this du composant comme ceci :

VK.init(function(){
    console.info("API initialisation successful");
    VK.api('users.get',{fields: 'photo_50'},function(data){
        if(data.response){
            this.setState({ //the error happens here
                FirstName: data.response[0].first_name
            });
            console.info(this.state.FirstName);
        }

    }.bind(this));
}.bind(this), function(){
    console.info("API initialisation failed");

}, '5.34');

En liant les appels à this, vous vous assurez que le mot clé this à l'intérieur des fonctions de rappel fait référence à l'instance correcte du composant React, rendant this.setState accessible.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!