问题描述
创建一个 HOC 类来查看“子”类中设置的一堆组件。
import * as React from 'react';
export class Container<C = any,P = {}> extends React.Component {
Components: C[]
props: React.PropsWithChildren<P>
render() {
return (
<>
{this.Components.map((Component: C,index) => {
return (
<Component key={index} />
)
})}
</>
)
}
}
JSX element type 'Component' does not have any construct or call signatures.ts(2604)
解决方法
这里有很多错误。我不明白这是一个 HOC 或者它是如何工作的,因为属性 this.Components
没有在任何地方设置。高阶组件是一个函数,它接受一个组件并返回一个组件。它可以是一个返回类的函数,但它本身不是一个类。
您问题中的特定错误是由于泛型 C
造成的,它是 this.Components
中每个组件的类型。您已经说过 C
可以是任何东西,因此它不必是有效的可调用组件。这就是为什么您会收到“JSX 元素类型‘组件’没有任何构造或调用签名”的错误消息。去掉 C
并使你的组件成为 React.ComponentType
类型。这确保它们可以通过 JSX 调用。