Possible bug in hooks sample code
Dieses Issue hat noch niemand übernommen.
- Vorherrschende Sprache
- JavaScript
- Sterne
- 11.8k
- Forks
- 7.9k
- Ø Merge
- 1 T. 11 Std.
- Gemergte PRs (30 T.)
- 11
Beschreibung
In this section:
https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
const handleSubmit = useEventCallback(() => {
alert(text);
}, [text]);
Where useEventCallback is:
function useEventCallback(fn, dependencies) {
const ref = useRef(() => {
throw new Error('Cannot call an event handler while rendering.');
});
useLayoutEffect(() => {
ref.current = fn;
}, [fn, ...dependencies]);
return useCallback(() => {
const fn = ref.current;
return fn();
}, [ref]);
}
Which means useLayoutEffect() is re-run each time fn changes.
Since fn in the example is re-created on each render it means that useLayoutEffect() always re-runs.
But at the same time the fn function can't be not created on each render because it depends on text which is re-defined on each render.
Beitragsleitfaden
Erste Schritte
- Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
- Forke das Repository und arbeite in einem Branch.
- Öffne einen Pull Request, der die Issue-Nummer nennt.
Rechercherichtung
Beginne damit, den verlinkten Abschnitt der Hooks FAQ zu lesen und das useEventCallback-Beispiel zu untersuchen, insbesondere dessen useLayoutEffect- und useCallback-Abhängigkeiten. Bestätige, ob sich das Beispiel wie dokumentiert verhält, und aktualisiere anschließend das Beispiel oder seine Erklärung, damit das beabsichtigte Verhalten und die Kriterien für den Abschluss klar sind.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- javascript, react
- Bereich
- documentation
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Veraltet
- Klarheit
- Muss geklärt werden
- Anfängerfreundlichkeit
- 35/100