这是 构造函数 和 实例 之间的混淆。

请记住，当你在 React 中编写组件时：

class Greeter extends React.Component<any, any> {
    render() {
        return <div>Hello, {this.props.whoToGreet}</div>;
    }
}

你可以这样使用它：

return <Greeter whoToGreet='world' />;

你 不要 这样使用它：

let Greet = new Greeter();
return <Greet whoToGreet='world' />;

在第一个示例中，我们传递了 Greeter ，即我们组件的 构造函数 。这是正确的用法。在第二个示例中，我们传递了 Greeter 的 实例 。这是不正确的，并且会在运行时失败，并出现“对象不是函数”之类的错误。

此代码

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

的问题在于，它需要 React.Component 的一个 实例 。您需要的是一个接受 React.Component 的 构造函数 的函数：

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

或类似代码：

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

如果要将组件类作为参数（而不是实例），请使用 React.ComponentClass ：

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

以下对我有用： https://github.com/microsoft/TypeScript/issues/28631#issuecomment-472606019 我通过执行以下操作来修复它：

const Component = (isFoo ? FooComponent : BarComponent) as React.ElementType