我写了一些代码:
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>; }