如何迭代从ReactDOMRe.domElementToObj获得的children？

Question

我正在尝试实现 FLIP 动画技术。我必须访问反应元素 children.

的 getBoundingClientRect()

let ref = React.useRef(Js.Nullable.null);

<div ref={ReactDOMRe.Ref.domRef(ref)}>
  {Belt.List.map(items, item => {
    // ...
  })}
</div>

我正在以这种方式访问参考内容：

let elMaybe = ref->React.Ref.current->Js.Nullable.toOption;

然后 children of DOM 元素:

let children = el->ReactDOMRe.domElementToObj##children;

我对 children 有疑问。如果我使用 Js.log(children)，我会在开发控制台中看到 children 的正确列表。但是 List.length(children) 总是 returns 2.

此代码：

Belt.List.map(children, child => {
  Js.log(child)
});

仅记录第一个 child 和 undefined。

我应该如何迭代那些children？有没有比 Js.log 更好的方法来调试 object 的内容？

Answer 1

children 不是 list，而是 array。你永远不会从 JavaScript 得到 lists，因为它在那里不作为一个概念存在。

用Array.length和Belt.Array.map代替就好了

有关详细信息，请参阅 List & Array 上的 Reason 文档。

How to iterate children obtained from ReactDOMRe.domElementToObj?