react setstate toggle code example

Example 1: toggle boolean state react

this.setState(prevState => ({
  check: !prevState.check
}));

Example 2: react toggle state

this.setState(prevState => ({
  iover: !prevState.iover
}));

Example 3: toggle with setState

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      visibility: false
    };
    // change code below this line
    this.toggleVisibility = this.toggleVisibility.bind(this);
    // change code above this line
  }
  // change code below this line
  toggleVisibility() {
    this.setState(state => {
      if (state.visibility === true) {
         return { visibility: false };
       } else {
         return { visibility: true };
      }
    });
  }
  // change code above this line
  render() {
    if (this.state.visibility) {
      return (
        <div>
          <button onClick={this.toggleVisibility}>Click Me</button>
          <h1>Now you see me!</h1>
        </div>
      );
    } else {
      return (
        <div>
          <button onClick={this.toggleVisibility}>Click Me</button>
        </div>
      );
    }
  }
};

Example 4: react toggle state

this.setState(prevState => ({
  iover: prevState.iover === 'hide' ? 'show' : 'hide'
}));