CODEWITHSUNDEEP
javascriptreactjs
Ali Xaka
Ali Xaka

Reputation: 1

Reactjs TypeError: Class extends value undefined is not a constructor or null

Actually I have just started learning react. I'm taking tutorials from websites. but when I compiled my this code in command line it says "Compiled Successfully" but when I open the browser it says

"TypeError: Class extends value undefined is not a constructor or null"

Actually I don't know how to fix this issue. But due to this error I'm unable to continue my course. 

import React, {component} from 'react';
import CardList from './CardList';
import {robots} from './robots';
import SearchBox from './SearchBox';

class App extends component {
    constructor(){
        super()
        this.state = {
        robots: robots,
        searchfield: ''     
        }
    }
    onSearchChange(event) {
        console.log(event.target.value);
    }
    render () {
    return (
        <div className='tc'>
        <h1> RoboFriends </h1>
        <SearchBox searchChange={this.onSearchChange}/>
        <CardList robots ={this.state.robots}/>
        </div>
        );
    }
 }  

export default App;

Upvotes: 0

Views: 3417

Answers (2)

ravibagul91
ravibagul91

Reputation: 20755

React uses PascalCase naming for components (class),

import React, {component} from 'react';

here component should be Component

import React, {Component} from 'react';

class App extends Component {

Or you have another way,

import React from 'react';

class App extends React.Component {

Upvotes: 2

yimei
yimei

Reputation: 433

Capitalize the word "component"

import React, {Component} from 'react';

class App extends Component

Upvotes: 0

Related Questions