Table Of Contents
A Note From the Author
Intro
Unidirectional Data Flow
Adding Imperative Logic
Imperative Handling and Function Compon...
For further actions, you may consider blocking this person and/or reporting abuse
"One of the rare spots where I’ve encountered useImperativeHandle in the wild is when there's some kind of scrollable area and button to let the user scroll all the way back up to the top." could you show the practical example please? I struggle to imagine it :) Thank you for this nice piece
Nice article, I was captivated and learned a few things.
Is there a reason why we shouldn't do it this basic way? I just tested the following and it seems to function exactly the same. There must be some reason the React devs recommend the convoluted approach with all the Ref forwarding and imperative handles ... or maybe not?
What you have setup with the
useEffectworks because it's nearly identical touseImperativeHandle. The difference, and the reason you want to useuseImperativeHandle, is because in addition to the side effect,useImperativeHandlewill automatically cleans up the reference when the child component unmounts.Of course, you can add that logic yourself in the
useEffecthook, but you'd have to remember to add that logic every time you have this situation. React has the information it needs to perform that logic for you automatically. This helps to prevent memory leaks and unreachable code.Thanks for a good article. Interesting to see how useImperativeHandle works
Thank you!
Thanks for such a detailed explination of this hook very helpful.
Thank you for reading!
Very well explained Anik! Looking forward to the remaining of the series :)
Thanks Vijay! Got delayed by upheavals in life and helping parents with retirement :)
Hi
Very interesting article about useImperativeHandle, congrats!!
Personally I never use it since I started to use hooks (about 2 years ago), but it might be handy in some situations, so I will remember it.
Thanks!
Thanks for reading!
Wow, very good write-up!
Thanks for reading, Sascha! Stay tuned for more :D
Thanks for this amazing piece. I have a doubt. Cant we create a ref in parent, pass it to child, assign that ref in the child element’s jsx and use that ref both in child and parent with full access to the element’s api. Am i missing something?
Really good explanation, well done 👍
Thank you!
Nice article,
as you mentioned it's important to use it wisely there is an example to show when not use it https://www.youtube.com/watch?v=akeb4SFWcJM&t=281s
Great article! Appreciate the effort you took to explain it so elaborately. Will look forward to more such in-depth articles from you.