remove class react

Solutions on MaxInterview for remove class react by the best coders in the world

showing results for - "remove class react"
Jan
27 Jul 2016
1You can make use of the state to store the active div and then conditionally add active class to it
2
3class Hello extends React.component{
4  state = {
5    active: ''
6  }
7  addActiveClass(e){
8      const clicked = e.target.id
9      if(this.state.active === clicked) { 
10          this.setState({active: ''});
11      } else {
12          this.setState({active: clicked})
13     }
14  }
15
16  render() {
17     return (
18   <div>
19<div className={`red green blue ${this.state.active === "first"? 'active': ''}`} id="first" onClick={this.addActiveClass}>Hello World</div>
20<div className={`red green blue ${this.state.active === "second"? 'active': ''}`} id="second" onClick={this.addActiveClass}>Good Bye World</div>
21  </div>
22     )
23  }
24}