Write-a-simple-counter - misplaced guide comment

Challenge Name

write-a-simple-counter has an issue.

Issue Description

The //change code below this line on line 8 is in the wrong place. It needs to be INSIDE the closing brace of the constructor. The …bind(this) statements need to be inside the constructor and it’s counter intuitive to put code outside of the specially commented area.

Browser Information

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36.

Screenshot

image

Your Code


class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    };
  this.increment = this.increment.bind(this);
  this.decrement = this.decrement.bind(this);
  this.reset = this.reset.bind(this);
  }
  // change code below this line


  increment(){
    this.setState( {
      count: this.state.count + 1
    })
  }
  decrement(){
    this.setState({
      count: this.state.count - 1
    })
    
  }
  reset(){
    this.setState({
      count: 0
    })
  }
  
  // change code above this line
  render() {
    return (
      <div>
        <button className='inc' onClick={this.increment}>Increment!</button>
        <button className='dec' onClick={this.decrement}>Decrement!</button>
        <button className='reset' onClick={this.reset}>Reset</button>
        <h1>Current Count: {this.state.count}</h1>
      </div>
    );
  }
};

Thanks for pointing that out. Please submit the issue on the issue tracker if it’s not yet there already.

Already an issue: https://github.com/freeCodeCamp/freeCodeCamp/issues/16554

1 Like