reason - 如何对 React.Ref.t(Js.Nullable.t('a)) 类型的值进行模式匹配

Question

我正在尝试将 DOM 元素作为 JS 对象访问。

let navRef = React.useRef(Js.Nullable.null);
  let width =
    switch (Js.Nullable.toOption(navRef)) {
    | None => 0.0
    | Some(nav) => ReactDOMRe.domElementToObj(nav)##clientWidth
    };

但是我在里面的 navRef 上有一个类型错误Js.Nullable.toOption

错误：此表达式的类型为 React.Ref.t(Js.Nullable.t('a)) 但表达式应为 Js.Nullable.t('b) = Js.nullable('b) 类型

Answer 1

React.Ref.t是一种不透明的类型，因此您不能直接对其进行模式匹配。但是您可以使用以下方式访问 ref 的值，React.Ref.current然后对其进行模式匹配：

let navRef = React.useRef(Js.Nullable.null);
  let width =
    switch (Js.Nullable.toOption(React.Ref.current(navRef))) {
    | None => 0.0
    | Some(nav) => ReactDOMRe.domElementToObj(nav)##clientWidth
    };