Conditional classes and toggling state

Posted on

in

,

Here’s a basic example:

<div className={`defaultClass ${this.state.con1 ? "con1" : ""} 
${this.state.con2 ? "con2" : ""}`}>
  something
</div>

And you can toggle the state like so:

handleClick(e){
    this.setState(prevState => ({
      con1: !prevState.con1
    })
    );
  }

Demo here.

Leave a Reply

Your email address will not be published. Required fields are marked *

About me

Mark Wong is a front end developer with 10+ years experience. Most of his knowledge of HTML5, CSS and Js is self taught.

Calendar

May 2024
M T W T F S S
 12345
6789101112
13141516171819
20212223242526
2728293031