打字稿结合通用对象类型

Question

我正在使用一个具有这样声明类型的React模块

export declare type SomeContainer = React.FunctionComponent<{
    prop1: string
    prop2: number
    prop3: () => void
}>

我想为此添加一个内部类型

type Container = React.FunctionComponent<{
    prop4: string
}>

因此，如果不使用模块编写，则所需的类型将如下所示

type DesiredContainer = React.FunctionComponent<{
    prop1: string
    prop2: number
    prop3: () => void
    prop4: string
}>

所以我试图像这样将它们结合起来

type Combined = SomeContainer & Container

但是问题是，当我将此新类型用于功能组件时，

const Component: Combined = props => {

我收到错误Parameter 'props' implicitly has an 'any'，并且props变量上都不能使用任何属性。

是否可以通过组合这些类型来实现所需的功能，还是必须在内部用自己的模块声明类型？

Answer 1

您可以提取传递给Container函数的参数的类型信息：

type SomeContainerArgType = SomeContainer extends (arg1: infer U) => any ? U : any;

然后：

type MyType = SomeContainerArgType & {
    prop4: string;
};

type DesiredContainer = React.FunctionComponent<MyType>;