流类型 React ref 回调和 createRef

Question

class Component extends React.Component<ComponentProps> {
  // ...magic
  elementRef = React.createRef();

  render() {
    return this.props.children(this.elementRef);
  }
}

这是我拥有的一个组件。它基本上将 ref 回调传递给孩子。 然后像这样使用它

<Component>
  {elementRef => (
    <div ref={elementRef} />
  )}
</Component>

我的Component 的目的是让孩子们可以将elementRef 附加到任何元素上。

但是我在正确输入组件时遇到了很多麻烦。

我现在在做什么：

type ComponentProps = {
  +children: (
    ref: { current: HTMLDivElement | null } | ((ref: ?HTMLDivElement) => void)
  ) => React.Node,
};

但显然这只适用于div。如果我要在跨度上使用 elementRef。 Flow 会抱怨。

那么我应该如何正确输入我的Component 以便它适用于任何 HTML 元素？

Answer 1

我认为this 可能会解决您的问题。它还没有在文档中。

{current: null | React$ElementRef<ElementType>}