当声明React Class组件时，使用React。ComponentClass而不是React。组件，那么它将修复ts错误。

看起来现在有一个特殊的新TypeScript类型来解决这个问题:JSXElementConstructor。如果你让某人将构造函数传递给一个未知的ReactElement，而不是该ReactElement的实例，这是传递的正确类型。

const renderGreeting = (Elem: JSXElementConstructor<any>) => {
    return <span>Hello, <Elem />!</span>;
}

这等价于上面选择的正确答案，因为:在JSX中使用<Elem />(也就是用尖括号将大写变量括起来)等效于使用new关键字调用JSX元素的构造函数。

你可以使用

function renderGreeting(props: {Elem: React.Component<any, any>}) {
    return <span>Hello, {props.Elem}!</span>;
}

但是，下面的方法有用吗?

function renderGreeting(Elem: React.ComponentType) {
    const propsToPass = {one: 1, two: 2};

    return <span>Hello, <Elem {...propsToPass} />!</span>;
}

如果你正在使用一个功能组件，并传递一个组件作为道具，对我来说，解决方案是改变React。ReactNode to React。应用的

interface Props{
  GraphComp: React.ElementType
}

const GraphCard:React.FC<Props> = (props) => {
  const { GraphComp } = props;

  return (
   <div> <GraphComp /> </div>
  )
}

如果你想把一个组件类作为参数(而不是一个实例)，使用React。ComponentClass:

function renderGreeting(Elem: React.ComponentClass<any>) {
    return <span>Hello, <Elem />!</span>;
}

就我而言，我使用的是React。ReactNode作为功能组件的类型，而不是React。FC型。

准确地说，在这个组件中:

export const PropertiesList: React。FC = (props: any) => { Const列表:string[] = [ 《后果:Phasellus sollicitudin》， 《后果:Phasellus sollicitudin》， “……” ］ 回报( <列表 header={<ListHeader header= "Properties List" />} 数据源={}列表 renderItem={(listItem, index) => <列表。项目键={index}> {listItem} </List. index . > {listtitem}项> ｝ /> ） ｝