如何添加对 HTMLCollection 项目的反应引用？

Question

我正在尝试访问 react-markdown 中每个 paragraph/heading 的附加引用。但是我不知道如何在下面的 c 中添加引用。

const children = Array.from(div.children)
children?.forEach((c, i) => {
  // c = <p>...</p> or <h1>...</h1>
  // add ref from useRef to c
})

Answer 1

您可以使用 ReactcloneElement(element, propsObject, childrenAray) 克隆元素。这会保留克隆元素中的 key 和 ref 属性。更多信息请点击此处：https://reactjs.org/docs/react-api.html#clonelement

或者您可以这样做：

const children = Array.from(div.children)
children?.forEach((c, i) => {
  return <c.type {...c.props} ref={yourRef} key={i}>{c.props.children}</c.type>
})

如何添加对 HTMLCollection 项目的反应引用？

How to add react reference to HTMLCollection items?

reactjs

react-markdown