这是一个分支React FunctionComponent 的 TypeScript 类型恰好返回一个 IntrinsicElement.
React 定义
declare namespace JSX {
type Element = React.ReactElement<any, any>;
}
虽然我找不到它@types/react/index.d.ts
,渲染一个<Fragment>
返回一个JSX.Element
。因此,如果我想为一个返回恰好一个 HTML 元素(即不是Fragment
除非它只有一个孩子,这会破坏它的目的),我需要以某种方式将我的返回类型限制为类似
type IntrinsicFC =
() => Exclude<JSX.IntrinsicElements[keyof JSX.IntrinsicElements], ReactElement<any, any>>;
(Note: Exclude<..., ReactElement<any, any>>
does not意思就是我所期望的;它似乎与JSX.IntrinsicElements[keyof JSX.IntrinsicElements]
虽然我不明白为什么。但是,为了这个问题,假设我did知道我试图表达的内容的正确类型。)
然而,any
是强类型的消亡,并且由于每个 HTML 元素都扩展了ReactElement<any, any>
,这会让我的类型() => never
.
有没有办法排除作为类型别名的类型SomeGenericType<any>
?
我最近一次失败的尝试IntrinsicFC
is:
type IntrinsicElement = JSX.IntrinsicElements[keyof JSX.IntrinsicElements];
type IntrinsicFC<P = void> =
((props: P) => IntrinsicElement) extends ((props: P) => JSX.IntrinsicElements[infer U & keyof JSX.IntrinsicElements])
? U extends keyof JSX.IntrinsicElements
? ((props: P) => JSX.IntrinsicElements[U])
: never
: never;
然而,这会导致type IntrinsicFC<P = {}> = never;
, 因为IntrinsicElement
always延伸JSX.IntrinsicElements[keyof JSX.IntrinsicElements]
因为它的定义完全相同。
TS游乐场
我怀疑React团队在写声明文件时,他们的意思是JSX.Element
定义为
type Element = React.ReactElement<unknown>;
但该类型早于 TypeScript v3.0.0,即介绍了unknown type,现在改变它将是一个突破性的改变。但是,我只是尝试手动更改类型声明,但仍然不起作用,所以......????♀️