domreasonreason-react

Getting clientHeight from a react-reason DOM ref

I'm accessing a reason-react DOM reference in order to ascertain client height.

Unfortunately clientHeight doesn't seem to be part of the ref API. So this fails:

ref
  -> React.Ref.current
  -> Js.Nullable.toOption
  -> Belt.Option.map(this => {
    React.Ref.clientHeight(this);
});

The value clientHeight can't be found in React.Ref.

Is there a way to extract the height of a component from the ref?

The ref was acquired from a div.

Solution

  • Assuming you acquired the ref from either ReactDOMRe.Ref.domRef or ReactDOMRe.Ref.callbackDomRef, you will receive a Dom.element and can use Element.clientHeight from bs-webapi:

    open Webapi.Dom;

ref
  -> React.Ref.current
  -> Js.Nullable.toOption
  -> Belt.Option.map(Element.clientHeight);