CODEWITHSUNDEEP
javascriptreactjs
Coder1000
Coder1000

Reputation: 4491

Error: Cannot read property of null

CODE:

var Game = createReactClass({

    getInitalState() {
        return {
            start: false
        }                    
    },

    handleStartClick() {
        this.setState({
            start: true
        })
    },

    handleStopClick() {
        this.setState({
            start: false
        })
    },

    render() {
        return (
            <div>
                <h1>React.js Game of Life</h1>
                <div className="buttons">
                    <button className="btn btn-danger" onClick={this.handelStopClick}>Stop</button>
                    <button className="btn btn-success" onClick={this.handelStartClick}>Start</button>
                </div>
                <Board start={this.state.start}/>
            </div>
        )
    }

});

QUESTION:

Here is the error I get:

Cannot read property 'start' of null

If I change this.state.start to this.props.start, the error goes away but the board does not render.

How can I resolve this situation ?

Upvotes: 0

Views: 1763

Answers (2)

Panther
Panther

Reputation: 9418

Your state object is null. This is because you have typo in your function name. The function name should be getInitialState. Then your state would have the default value of start:false

Upvotes: 0

Mayank Shukla
Mayank Shukla

Reputation: 104509

Issue is, you have a spelling mistake, Instead of getInitalState use getInitialState, that's why, you are getting that error:

Cannot read property 'start' of null

Use this, it will work:

getInitialState() {
    return {
        start: false
    }                    
},

Upvotes: 3

Related Questions