npmreactjs95% confidence\u2191 429

What does the error "JSX element type '...' does not have any construct or call signatures" mean?

Full error message
I wrote some code:

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

I'm getting an error:

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

What does it mean?

This is a confusion between constructors and instances. Remember that when you write a component in React: class Greeter extends React.Component<any, any> { render() { return <div>Hello, {this.props.whoToGreet}</div>; } } You use it this way: return <Greeter whoToGreet='world' />; You don't use it this way: let Greet = new Greeter(); return <Greet whoToGreet='world' />; In the first example, we're passing around Greeter, the constructor function for our component. That's the correct usage. In the second example, we're passing around an instance of Greeter. That's incorrect, and will fail at runtime with an error like "Object is not a function". The problem with this code function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } is that it's expecting an instance of React.Component. What you want is a function that takes a constructor for React.Component: function renderGreeting(Elem: new() => React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } or similarly: function renderGreeting(Elem: typeof React.Component) { return <span>Hello, <Elem />!</span>; }

API access

Get this solution programmatically \u2014 free, no authentication.

curl https://depscope.dev/api/error/a2905f959ae941fd77d71ba5b2a4416782b643826f62852684b21254b9145329
hash \u00b7 a2905f959ae941fd77d71ba5b2a4416782b643826f62852684b21254b9145329
What does the error &quot;JSX element type &#39;...&#39; doe… — DepScope fix | DepScope