How to use React Ref?


#1

Hi all

I am trying to use React Ref as following:

open Webapi.Dom;

let component = ReasonReact.statelessComponent("NavBulkView");

let setSectionRef = (theRef) => {
  Js.log(theRef);
};

let make = (_children) => {
  ...component,
  didMount: _self => {

    let ele = Document.querySelector("#foo", document);
    switch ele {
    | None => Js.log("Nothing")
    | Some(a) => Js.log(Element.innerText(a))
    };

    ReasonReact.NoUpdate;
  },
  render: self => {
    <div id="foo" ref={self.handle(setSectionRef)}>
      {ReasonReact.stringToElement("Hello")}
    </div>
  }
};  

The compiler gives a warning:

 Here's the original error message
  This has type:
    'a => unit
  But somewhere wanted:
    ('a, ReasonReact.self('b, 'c, 'd)) => unit . 

What kind of type do I have to provide in setSectionRef function?

Thanks


#2

It looks like the type of setSectionRef needs to be:

let setSectionRef = (theRef, {ReasonReact.state}) => {
  Js.log(theRef);
};

Taken from https://reasonml.github.io/reason-react/docs/en/react-ref.html