Qu'est-ce que setstate en réaction

Dans React, setstate est la méthode utilisée pour mettre à jour l'état du composant ; setState() met en file d'attente les modifications apportées à l'état du composant et informe React qu'il doit restituer ce composant et ses sous-composants en utilisant l'état mis à jour. (objet,[fonction de rappel])".

L'environnement d'exploitation de ce tutoriel : système Windows 10, React version 17.0.1, ordinateur Dell G3.

Qu'est-ce que setstate dans React

Sur la base d'une utilisation quotidienne, nous l'utilisons essentiellement pour mettre à jour l'état du composant. Selon la documentation officielle :

setState() met en file d'attente les modifications apportées à l'état du composant et informe React que ce composant et ses sous-composants doivent être restitués avec l'état mis à jour. Il s'agit du principal moyen de mettre à jour l'interface utilisateur en réponse aux gestionnaires d'événements et au traitement des données du serveur.

Considérez setState() comme une requête plutôt que comme une commande qui met immédiatement à jour le composant. Pour une meilleure performance perçue, React l'appelle paresseusement puis met à jour plusieurs composants en un seul passage. React ne garantit pas que les changements d'état prendront effet immédiatement.

Selon son explication, la fonction de setState est de mettre en file d'attente la tâche de mise à jour de l'état du composant dans la file d'attente des tâches, au lieu de mettre à jour immédiatement l'état de l'état en l'appelant, c'est-à-dire que setState est considéré comme une requête plutôt que comme une commande. pour mettre à jour immédiatement le composant. Par conséquent, lorsque vous obtenez la valeur de l'état du composant après avoir appelé la méthode setState, vous obtiendrez une valeur qui n'a pas été mise à jour.

setState() ne met pas toujours à jour les composants immédiatement. Il diffère les mises à jour par lots. Cela rend dangereux la lecture de this.state immédiatement après avoir appelé setState(). Pour éliminer les dangers cachés, veuillez utiliser la fonction de rappel de composantDidUpdate ou setState (setState(updater, callback)). Les deux méthodes peuvent garantir qu'elle est déclenchée après la mise à jour de l'application.

Utilisez

setState(updater, [callback]),

updater comme fonction qui renvoie l'objet stateChange : (state, props) => stateChange

this.setState(state => ({count: state.count + 1}), () => { 
// 在状态更新且界面更新之后回调
        console.log('test3 setState callback()', this.state.count)
      })

setState(stateChange, [callback])

stateChange est l'objet,

callback est une fonction de rappel facultative, qui sera utilisée après le statut est mis à jour et l'interface est mise à jour.

this.setState({count: this.state.count + 1}), () => {
 // 在状态更新且界面更新之后回调
        console.log('test3 setState callback()', this.state.count)
      })

Résumé :

La méthode objet est la méthode abrégée de la méthode fonction

Si le nouvel état ne dépend pas de l'état d'origine ===>

Si le nouvel état dépend de l'état d'origine===> Utilisez la fonction Method

Si vous avez besoin d'obtenir les dernières données d'état après setState(), lisez-les dans la deuxième fonction de rappel

Apprentissage recommandé : "

réagissez tutoriel vidéo"

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!