Calling state setter with same value doesn't reliably work as documented
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- JavaScript
- Estrellas
- 11.8k
- Forks
- 7.9k
- Merge medio
- 1 d 11 h
- PR fusionados (30 d)
- 11
Descripción
Thank you for the very high standard of documentation on the React website.
There's a bit that's slightly misleading, though. The "functional updates" section of the useState documentation says:
If your update function returns the exact same value as the current state, the subsequent rerender will be skipped completely.
However, if you watch calls to the component function doing the state update, it seems like a render occurs the first time you do that, because the component function gets called that first time. (Once it returns a bail-out means child components aren't called to rerender.) Subsequent times the component sets the same state value, even the component function isn't called (because of a separate "fast" bail-out).
That first time looks like a render to a dev who's read the documentation and expected setting the same value to be a no-op. That's confusing enough to have made @amsterdamharu file this closed bug report and to have made me, independently, come to github to write a bug report as well (but fortunately I found that one first).
Perhaps:
If your update function returns the exact same value as the current state, the subsequent rerender will be skipped completely (although the component function may be called, at least the first time).
...or something like that.
Then when developers see our component function get called even though we did setValue((v) => v);, we'll know it isn't a bug or our misunderstanding something; it's just part of the complexity of React (and there's probably a good reason for it).
Thanks.
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Comienza con la sección «functional updates» de la documentación vinculada de useState y revisa la afirmación sobre los valores de estado idénticos. Actualiza la redacción para explicar que la función del componente puede llamarse en la primera actualización al mismo valor, mientras que el rerenderizado posterior se omite; el cambio está hecho cuando la documentación ya no implica que la función siempre es un no-op.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript, react
- Área
- documentation
- Tipo de issue
- Documentación
- Dificultad
- 1/5
- Tiempo estimado
- Menos de una hora
- Estado de actividad
- Estancado
- Claridad
- Bien especificado
- Aptitud para principiantes
- 68/100