流类型React ref callback和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。 流会抱怨。

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

Answer 1

我认为这可以解决你的问题。 它尚未出现在文档中。

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