Pourquoi mon React ne définit-il pas correctement l'état de mise à jour d'intervalle ?

React State Hook et setInterval : un examen plus approfondi

Lors de l'utilisation de hooks d'état React dans setInterval, il est important de répondre à une mise en garde courante. . Dans certains cas, l'état peut ne pas se mettre à jour comme prévu au-delà du rendu initial.

Comprendre le problème

Le nœud du problème réside dans la fermeture capturée par setIntervalle. La fonction de rappel fournie à setInterval a accès à la valeur de l'état initial au moment du rendu. Cependant, les rendus suivants n'invoquent pas useEffect(), laissant la fonction de rappel avec une valeur d'état obsolète. Cela fait que le temps reste à 0 dans le rappel setInterval.

Solution : exploitez le formulaire de rappel d'état

Pour résoudre ce problème, utilisez la deuxième forme d'état. hooks, qui accepte un rappel. Ce rappel reçoit l'état actuel comme argument. En utilisant ce formulaire, vous pouvez accéder à la valeur d'état la plus récente avant de l'incrémenter.

setTime(prevTime => prevTime + 1); // Corrected version

Informations supplémentaires

Pour une exploration plus approfondie, le blog perspicace de Dan Abramov post propose des approches alternatives pour résoudre ce problème. Nous vous recommandons fortement de l'approfondir pour une compréhension plus approfondie.

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!