When would we use "useImperativeHandle" in ReactJs' hooks?
Nessuno ha ancora preso questa issue.
- Lingua principale
- JavaScript
- Stelle
- 11.8k
- Fork
- 7.9k
- Merge medio
- 1g 11h
- PR unite (30g)
- 11
Descrizione
I am trying to understand what ReactJs' team expects from developers when using the useImperativeHandle's method. Currently the documentation indicates that:
imperative code using refs should be avoided in most cases.
useImperativeHandleshould be used with forwardRef.
Does this means it is good practice to useuseImperativeHandlewithforwardRef? When would we useuseImperativeHandletypically?
More specifically, in this discussion on stackoverflow about how calling child'smethodsfrom parents , someone provided this answer which propose to useuseImperativeHandle. Then some comments argued that this is not good practice:
This is not really a good pattern. {...} It's better to pass
propsinto the child component and then have a button click in the parent change the parent'sstate, and pass astateitem into the child which will trigger the child'scomponentWillReceiveProps, and use that as a trigger.
No, it's not usually the best pattern, it's more of an escape hatch when you need it, and should be used only in emergencies.{...}
I would we make the things limpid for everyone, so here my specifics questions:
-
Is it good practice to use
useImperativeHandlewithforwardRef? -
When would we use
useImperativeHandletypically? -
Can we, or not, safely use
useImperativeHandlefor the convenience of easily communicatepropertiesandmethodsto the childs' parents? -
Why the documentation say that imperative code using refs should be avoided in most cases. useImperativeHandle should be used with forwardRef.?
-
What are the information to know to make an educated decision about the usage of
useImperativeHandle? -
lastly, is it safer, safe, and even a good practice to use the
useEffect's method to communicate element to parents, like in the following demo, here a relevant's snippet:
useEffect(() => {
ref.current = { componentState }; // get a forwardRef's reference, then transmit some state to parent by modifying the reference
validateChildren(ref.current.componentState.two);
});
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Direzione di ricerca
Non sono indicati file del repository né test. Inizia esaminando la documentazione di useImperativeHandle e forwardRef, la discussione collegata su Stack Overflow e l'esempio StackBlitz per determinare le indicazioni previste. Il lavoro è completato quando le domande elencate vengono risolte con una documentazione chiara e accurata sull'uso appropriato e sulle alternative.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- javascript, react
- Ambito
- documentation
- Tipo di issue
- Documentazione
- Difficoltà
- 5/5
- Tempo stimato
- Più di una settimana
- Stato di attività
- Ferma
- Chiarezza
- Da chiarire
- Idoneità per principianti
- 25/100