reactjs / reactjs/react.dev

Running an effect only on update vs Strict mode

Ouverte
#6,302 0 commentaires 1 réaction 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Langage dominant
JavaScript
Étoiles
11.8k
Forks
7.9k
Merge moyen
1 j 11 h
PR mergées (30 j)
11

Description

I have written a variation of the useEffect hook that should only run on updates. I used a useRef hook to accomplish this the way the FAQ in the old docs recommends it here:

image

I couldn't find the same piece in the new documentation.

The problem is that the effect still runs on the initial render when strict mode is on:
https://codesandbox.io/s/delicate-lake-88phjz?file=/src/App.js

however it behaves correctly when the strict mode is off:
https://codesandbox.io/s/hungry-wright-tl7p43?file=/src/App.js

In the former example the message is logged to the console right away even though it shouldn't be.

The possible explanations I can think of are:

  1. I'm doing something wrong. Can you please point the mistake out for me?
  2. The old docs are off and this is not the right way to do it. In this case can you please let me know what the right way of achieving this behavior is?
  3. The strict mode is to blame. I do find it irritating at times, if I'm frank, but that's probably unlikely.

Can someone help me with this? Thanks a lot!

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par reproduire le comportement dans les deux exemples CodeSandbox liés, en comparant les cas avec Strict Mode et sans Strict Mode. Lisez la documentation actuelle de useEffect et useRef ainsi que l’ancien extrait de la FAQ ; le travail est considéré comme terminé lorsque le comportement recommandé pour les effets qui ignorent le rendu initial est clairement documenté ou que l’issue est expliquée comme un comportement attendu de Strict Mode.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
javascript, react
Domaine
documentation
Type d'issue
Documentation
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
À clarifier
Accessibilité débutants
25/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.