Conversation
Allow passing an existing ref through the new optional `options.ref` parameter. When provided, the hook observes `ref.current` instead of the element assigned to the callback ref it returns. This makes it possible to measure an element that already has a ref, and to use multiple useMeasure hooks in one component to track different elements. Closes streamich#1227
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Adds an optional
options.refparameter touseMeasure. When provided, the hook observesref.currentinstead of the element assigned to the callback ref it returns.Why
Closes #1227. This has been requested by multiple users in that thread:
useRef(noref.current), so it cannot be combined with an existing ref.useMeasurehooks in one component to track different elements.The API is fully backward compatible: when
options.refis omitted, behavior is unchanged.Notes
ref.currentchanges, the layout effect re-runs and observes the new element (covered by a test).docs/useMeasure.mdwith the new usage.tests/useMeasure.test.tspass, including 2 new ones covering the external-ref path.