Monday, February 3, 2020

[ReactJs][Resolved] Uncaught TypeError: Super expression must either be null or a function, not undefined


Error message :

Source code

class NumberList extends React.components{
  render(){
    const numbers = this.props.numbers;
    const listItems = numbers.map((number) =>
      <li key={number.toString()}>
        {number}
      </li>
    );
    return (
      <ul>{listItems}</ul>
    );
  }
}
const numbers = [1,2,3,4,5];
ReactDOM.render(
  <NumberList numbers={numbers} />,
  document.getElementById('root')
);
In found I made a careless mistake : extended a wrong class
so I should extends class React.Component but not the incorrect one "React.components" to make this class as an react stateful component.

Correction

class NumberList extends React.Component{
  render(){
    const numbers = this.props.numbers;
    const listItems = numbers.map((number) =>
      <li key={number.toString()}>
        {number}
      </li>
    );
    return (
      <ul>{listItems}</ul>
    );
  }
}
const numbers = [1,2,3,4,5];
ReactDOM.render(
  <NumberList numbers={numbers} />,
  document.getElementById('root')
);

No comments :

Post a Comment