search

ZeeCoder / use-resize-observer

A React hook that allows you to use a ResizeObserver to measure an element's size.
MIT License
651 stars 42 forks source link

Dynamic array of elements #60

Closed oscarsidebo closed 3 years ago

oscarsidebo commented 3 years ago

I'm rendering an array of elements and need to capture the width of each element individually.

This hook works perfectly for a single element but is there a way to capture the sizes of a dynamic amount of elements?

I saw the example of reusing the hook by passing in custom refs but that example requires you to create all refs up front which wouldn't be possible with a dynamic amount of elements.

Any advice 🙏?

ZeeCoder commented 3 years ago

I would compose the hook into a component, because as opposed to hooks, components can be rendered conditionally. Then I'd map the set of elements to a set of these components, and aggregate the result from their onResize callback.

Hope that helps.

oscarsidebo commented 3 years ago

That worked, thanks

ZeeCoder commented 3 years ago

👌

On Mon, 8 Feb 2021, 00:05 oscarsidebo, notifications@github.com wrote:

That worked, thanks

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/ZeeCoder/use-resize-observer/issues/60#issuecomment-774784692, or unsubscribe https://github.com/notifications/unsubscribe-auth/AA4CKEWC2JG7A2TMRHVMT7DS54MCFANCNFSM4XHBWANA .