In Helix, React: an example of using the use-ref hook with a callback?

Questions & Help How to?
,
1

hi,

perhaps this is something new with React 19, but I see that a “ref” can be a callback function . (see “How to manage a list of refs using a ref callback” in the React docs)

can anyone point me to an example of this using Helix? . or do you know if Helix even allows this functionality of providing a callback fn to the :ref attribute?

thanks :slight_smile:,

Raphael

EDIT — I found a clue . when I use eg. (d/div ...) to create an element, giving :ref a callback does work; only when I use ($ MyComponent ...) does it not seem to be working (as the fn never gets called) . if… this means anything to anyone :slight_smile:

furthermore, when I use eg. ($ "div" {:ref ...} ...), it does work (and remember, I’m giving :ref a callback fn); but if I use ($ MyComponent {:ref ...} ...), it does not work (the callback fn is never called) . so it seems to be something about a custom component that makes the callback ref not work

2

See React 19 Deprecates forwardRef: A Guide to Passing ref as a Standard Prop | by Imran Khan | Medium

If you’re using React 18 or below, you will need to use forwardRef to pass the ‘:ref’ prop to a component.

See helix/docs/creating-components.md at master · lilactown/helix · GitHub for how to easily do that with Helix.