reactjs - TypeScript React : How do you pass a generic to a React. ComponentProps？

Question

语境

我有一个 Tree组件及其 props 使用泛型类型 T 定义:

type ITreeProps<T> = ICollapsibleTreeProps<T> | INonCollapsibleTreeProps<T>;

我的组件定义如下:

const Tree = <T extends {}>(props: ITreeProps<T>) => { /* ... */ };

问题

现在，如果我创建一个 type使用 React.ComponentProps (在导入 Tree 组件的单独文件中)

type ITreeComponentProps = React.ComponentProps<typeof Tree>;

泛型被自动视为 {} ，所以结果类型是:

type ITreeComponentProps = ICollapsibleTreeProps<{}> | INonCollapsibleTreeProps<{}>

题

有没有办法将泛型传递给 React.ComponentProps所以我可以指定我自己的类型而不是强制它 {} ?

我的直觉是做以下事情，即 不起作用 ，虽然我希望泛型类型不必指定 T :

type ITreeComponentProps<T> = (React.ComponentProps<typeof Tree>)<T>;

结果类型为

type ITreeComponentProps<T> = ICollapsibleTreeProps<T> | INonCollapsibleTreeProps<T>

所以我可以这样使用它:

const someFunction = <T extends {}>(p: ITreeComponentProps<T>) => { /* ... */ }; 

临时解决方案

在找到解决方案之前，我可以将其用作最后一个片段的唯一方法是导出 ITreeProps并将其导入到我的另一个文件中，而不是使用 React.ComponentProps .但是，我通常不喜欢将我的组件 Prop 作为个人偏好导出。

Answer 1

typeof Tree<Foo>

这在 TypeScript 中是不可能的 https://github.com/microsoft/TypeScript/issues/204
TL;博士 typeof使用值和 Tree<Foo>是一种类型，尽管如此 Tree本身就是一个值。
P.S:我们还使用与组件一起导出的类型
P.P.S:维护者不鼓励使用 React.ComponentProps https://github.com/DefinitelyTyped/DefinitelyTyped/pull/34899#issuecomment-485815000