小编Vla*_*hek的帖子

我有一种情况，我想显式地将React.FC的子组件的作用域限定为特定类型，并覆盖默认的React.ReactNode。

目的是要创建一个小的库，并且要产生编译时错误，该错误将告诉用户他只能将特定的组件类型用作父级的子级。

一个好的例子是：

<MainComponent>
    <ChildComponent>
</MainComponent>

一个失败的例子是：

<MainComponent>
    <Route ...>
    <ChildComponent>
</MainComponent>

• 这应该失败，因为Route组件不是，ChildComponent并且检查失败。

中的默认子级属性React.FC派生自：

interface FunctionComponent<P = {}> {
    (props: PropsWithChildren<P>, context?: any): ReactElement | null;
    propTypes?: WeakValidationMap<P>;
    contextTypes?: ValidationMap<any>;
    defaultProps?: Partial<P>;
    displayName?: string;
}

type PropsWithChildren<P> = P & { children?: ReactNode };

我尝试过的是这样的：

Omit<React.FC, 'children'> & {
  children: ChildComponent | ChildComponent[];
}

但是我只能得到React.ReactNode我的孩子和我的工会React.ReactNode。

我似乎无法弄清楚如何覆盖此道具，以便仅将我的类型明确用于此道具。

我正在使用Typescript 3.5.3和Omit/ Extend...，现在已成为标准TS库的一部分。