React - Write a Simple Counter

JavaScript
1

Tell us what’s happening:

hello, my output is correct and the logic works as all buttons function but yet my code isn’t passing, is there a minor syntax error pls let me know

Your code so far

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

  // Change code below this line
  reset() {
    this.setState(() => ({
      count:0,
    }));
  }

  increment() {
    this.setState((state) => ({
      count: state.count + 1,
    }));
  }

  decrement() {
    this.setState((state) =>({
      count: state.count -1,
       }));
  }

  // 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>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Challenge Information:

React - Write a Simple Counter

2

After your bind statements, you should have a closing curly bracket, which closes off the constructor method. It was there before you added your code but you appear to have inadvertently deleted it.
(The bind statements belong inside the constructor method, but the reset etc methods do not).

1 Like
3

thank you so much for your help, it worked!

1 Like