React.memo与反应中的打字稿

Question

我在.tsx文件中使用React.memo（）（React typescript）

现在我已经为Props声明了一个接口：

interface Props {
  type?: string;
}

我的组件看起来像：

const Component: React.SFC<Props> = props => {
  /// return something;
};

export default memo(Component);

现在因为type是一个可选的prop我打算有时只使用它。

如果我使用我的组件作为<Component type="something" />一切都没问题。 但如果我用它作为<Component />我得到错误 - >

输入'{children：string; }'没有与'IntrinsicAttributes＆Props'类型相同的属性。

这似乎是一个非常荒谬的错误，因为我在Code沙盒上尝试了这一点，一切正常。 关于错误可能是什么的任何想法？

UPDATE

如果我在界面中明确添加道具就像

interface Props {
  type?: string;
  children?: ReactNode;
}

那么在那种情况下一切正常。 这应该是隐含的，但要考虑到它所带来的错误

'{children：string; }”

有任何想法吗？？？

Answer 1

我相信打字有一个错误。 更改

function memo<P extends object>(
  Component: SFC<P>,
  propsAreEqual?: (
    prevProps: Readonly<PropsWithChildren<P>>,
    nextProps: Readonly<PropsWithChildren<P>>
  ) => boolean
): NamedExoticComponent<P>;

至

function memo<P extends object>(
  Component: SFC<P>,
  propsAreEqual?: (
    prevProps: Readonly<PropsWithChildren<P>>,
    nextProps: Readonly<PropsWithChildren<P>>
  ) => boolean
): NamedExoticComponent<PropsWithChildren<P>>;

解决了这个问题

UPDATE

嗯，实际上它不是一个bug。 见讨论 。

TLTR：您必须在组件道具类型中指定children 。