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

我认为this可能会解决您的问题。它尚未出现在文档中。

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

流类型React ref callback和createRef

1 个答案: