React - Write a Simple Counter why only a single equal sign

Tell us what’s happening:
So, I actually got all the tests to pass. My question is more a why.

When I first tried to get this to go through I had:
reset() {
this.setState(state =>({count: state.count === 0}));

For some reason if I used three or two equal signs, the tests wouldn’t pass and the reset button looked blank when I would click it. Only using the one worked right. I was just wondering why that was.

Thank you,
-Elizabeth
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
  increment() {
    this.setState(state => ({count: state.count + 1}));
  }
    decrement() {
    this.setState(state => ({count: state.count - 1}));
    }
    reset() {
    this.setState(state =>({count: state.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>
    );
  }
};

Your browser information:

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

Challenge: React - Write a Simple Counter

Link to the challenge:

These are two different (well, three) operators: = is the assignment operator, == is the comparison operator, and === is the strict comparison operator.

Here is a good post on stack overflow explaining this and the differences

I know it passes with that code but you shouldn’t assign values to the state like that. All you have to do is set the property to 0 in the return object.

Also, you do not need an updater function as you are not using the current state for anything.

this.setState({count: 0});

As for your question. I think you might have misunderstood how the setState updater function works. It isn’t like a filter it is just a callback with access to the current state that needs to return the newly updated state. The code you asked about would set the count state property to a boolean value of true or false depending on the condition.

You can add componentDidUpdate and log the state to see it.

componentDidUpdate() {
  console.log(this.state.count)
}

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.