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

September 2023
M T W T F S S
 123
45678910
11121314151617
18192021222324
252627282930