typescript – 错误“JSX元素类型”…没有任何构造或调用签名是什么意思?

前端之家收集整理的这篇文章主要介绍了typescript – 错误“JSX元素类型”…没有任何构造或调用签名是什么意思?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我写了一些代码
function renderGreeting(Elem: React.Component<any,any>) {
    return <span>Hello,<Elem />!</span>;
}

我收到一个错误

JSX element type Elem does not have any construct or call signatures

这是什么意思?

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

请记住,当您在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,<Elem />!</span>;
}

是期望React.Component的一个实例。你想要一个需要React.Component的构造函数函数

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

或类似地:

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

猜你在找的React相关文章