如何迭代从ReactDOMR.domElementToObj获得的子项

Question

我正在尝试实现FLIP动画技术。我必须访问react元素子元素的getBoundingClientRect()。

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

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

我以这种方式访问ref内容：

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

则DOM元素的子元素：

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

我对孩子们有意见。如果我使用Js.log(children)，我会在开发控制台中看到正确的子项列表。但是List.length(children)总是返回2。

此代码：

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

只记录第一个子和CCD_ 4。

我应该如何迭代这些孩子？有没有比Js.log更好的方法来调试对象的内容？

Answer 1

children不是list，而是array。您永远不会从JavaScript中获得list，因为它在那里并不是一个概念。

只需使用Array.length和Belt.Array.map，那么你应该很好。

请参阅List&数组了解更多详细信息。