Https://www.codecademy.com/courses/react-101/lessons/this-state/exercises/call-setstate-another-function?action=lesson_resume


#1

<PLEASE USE THIS TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>
https://www.codecademy.com/courses/react-101/lessons/this-state/exercises/call-setstate-another-function?action=lesson_resume

<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>
My code have no errors and I got everything right, but for some reason, the button doesn’t change the color. Any idea why?


const green = '#39D1B4';
const yellow = '#FFD712';

class Toggle extends React.Component {
  constructor(props){
    super(props)
    this.state = { color: green }
    this.changeColor = this.changeColor.bind(this);
  }
  
  changeColor() {
    this.state = this.state.color == green ? {color: yellow}: {color: green};
  }
  
  render() {
    return (
      <div style={{background: this.state.color}}>
        <h1>
          Change my color
        </h1>
        <button onClick={this.changeColor}>
          Change color
        </button>
      </div>
    );
  }
}

ReactDOM.render(<Toggle />, document.getElementById('app'))

https://www.codecademy.com/courses/react-101/lessons/this-state/exercises/call-setstate-another-function?action=lesson_resume


#2

@megaace93617
Inside of the function changeColor assign the entire ternary conditional to a new variable const newColor

you currently have it set to this.state

changeColor() {
    const newColor = this.state.color == green ? {color: yellow}: {color: green};
  }

You want to be able to use this.setState to update the value of the current state of Toggle

On a new line within the function changeColor update the state so it includes newColor

this.setState = ({myStateNameIs: myUpdatedStateValueIs});


#3

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