Maison > Article > interface Web > Pourquoi ne puis-je pas accéder à « setState » dans mon composant React ?
Erreur de type non interceptée : impossible d'accéder à la propriété 'setState' dans React
Lorsque vous travaillez avec React, vous pouvez rencontrer l'erreur "Erreur de type non interceptée : impossible lire la propriété 'setState' de non défini." Ce problème se produit lors de la tentative d'accès à la méthode 'setState' d'un composant qui n'est pas correctement lié.
La méthode 'setState' est utilisée pour mettre à jour l'état d'un composant React. Lors de la définition d'un composant, ses méthodes doivent être liées à l'instance du composant pour garantir que « ceci » fait référence à la portée correcte. Cette erreur survient souvent lorsque la méthode du composant est appelée en dehors du constructeur sans être explicitement liée.
Exemple :
Considérez l'extrait de code suivant :
<code class="javascript">class Counter extends React.Component { constructor(props) { super(props); this.state = { count : 1 }; this.delta.bind(this); // Binding delta incorrectly } delta() { this.setState({ count : this.state.count++ }); } render() { return ( <div> <h1>{this.state.count}</h1> <button onClick={this.delta}>+</button> </div> ); } }</code>
Dans cet exemple, la méthode 'delta' n'est pas liée au composant dans le constructeur. Par conséquent, lorsque 'delta' est appelé, 'this' ne fait pas référence à l'instance du composant et l'erreur se produit car 'setState' n'est pas accessible à partir de 'undefined'.
Solution :
Pour résoudre ce problème, il est nécessaire de lier correctement la méthode 'delta' au composant dans le constructeur :
<code class="javascript">constructor(props) { super(props); this.state = { count : 1 }; this.delta = this.delta.bind(this); // Correctly binding delta }</code>
En définissant 'this.delta = this.delta .bind(this)', vous attribuez la fonction liée à 'this.delta'. Cela garantit que lorsque « delta » est appelé, « this » fait référence à l'instance du composant, permettant l'accès à la méthode « setState ».
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!