javascript - 如何获得任意jsx的大小/边界矩形？

Question

我目前正在尝试获取从函数返回的一些 jsx 的尺寸/边界矩形。我在网上看到的每篇文章都说要创建一个引用并使用 element.current.getBoundingRect()。但是，我无法使用我的代码执行此操作，因为我正在使用一个函数来动态构建此 jsx 并将其放入一个对象中，而不是制作完整的反应组件。

有什么办法可以做到这一点吗？或者这是不可能的？

我唯一能做的就是在我的 .forEach 中动态创建一个新的全功能组件，而不是仅仅在一个片段中创建 jsx，但是当我尝试它仍然无法工作时，因为我无法访问 ref 之后.

编辑：这是我制作 jsx 的方式

export const createNodeTypes = (data) => {
  const nodesList = {};
  if (data) {
    data.forEach(({ node }) => {
        const newNode = () => (
          <>
            <div>
              <[insert other jsx here]>
            </div>
          </>
        );
        nodesList[node.name] = newNode;
      });
  }
  return nodesList;
};

值得注意的是，我这样做的原因是为了创建一个 nodeTypes 对象，比如 react-flow-renderer 期望自定义节点类型

标签： javascriptreactjsjsx