Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JSX element type 'Element[]' is not a constructor function for JSX elements?

"@types/react": "^16.7.17"
"@types/react-dom": "^16.0.11"
"typescript": "^3.2.2"

function ArryElement() {
  return [
    <div key='1'>1</div>,
    <div key='2'>2</div>
  ];
}

function App() {
  return <ArryElement />
}
like image 743
Whj Avatar asked Jan 03 '19 06:01

Whj


People also ask

What is JSX element type?

JSX is an embeddable XML-like syntax. It is meant to be transformed into valid JavaScript, though the semantics of that transformation are implementation-specific.

What is JSX element []?

What is JSX? JSX stands for JavaScript XML. JSX allows us to write HTML in React. JSX makes it easier to write and add HTML in React.

What is the use of constructor () in Reactjs?

js constructor() Method. A constructor is a method that is called automatically when we created an object from that class. It can manage initial initialization tasks such as defaulting certain object properties or sanity testing the arguments passed in.

Why can't we use constructor and super methods in React functional components?

Since it's a stateless component it doesn't have the component lifecycle. Therefor you can't specify a constructor . You have to extend React. Component to create a stateful component which then will need a constructor and you'll be able to use the state .


1 Answers

This is because React is expecting to return an object. What you do in this example, is return an array instead.

As a user mentioned above, wrapping it in a Fragment (which is an object) will solve the case

like image 139
John Theodorakopoulos Avatar answered Sep 17 '22 12:09

John Theodorakopoulos