Skip to main content
AI Assist is now on Stack Overflow. Start a chat to get instant answers from across the network. Sign up to save and share your chats.
deleted 2 characters in body
Source Link
krishnaacharyaa
  • 26.1k
  • 9
  • 102
  • 138

I have tried to tailored my answer to include all the best possible solution in the post.

There are many different ways of getting this done.

1. Inline inside the class

<div className={`... ${this.props.showBulkActions ? 'show' : 'hidden'}`}> ... </div> 

2. Using the values

var btnClass = classNames( ... { 'show': this.props.showBulkActions, 'hidden': !this.props.showBulkActions } ); 

3. Using a variable

let dependentClass = this.props.showBulkActions ? 'show' : 'hidden'; className={`... ${dependentClass }`} 

4. Using clsx

<div className={clsx('...',`${this.props.showBulkActions ? 'show' : 'hidden'}`)}> ... </div> 

I have tried to tailored my answer to include all the best possible solution in the post.

There are many different ways of getting this done.

1. Inline inside the class

<div className={`... ${this.props.showBulkActions ? 'show' : 'hidden'}`}> ... </div> 

2. Using the values

var btnClass = classNames( ... { 'show': this.props.showBulkActions, 'hidden': !this.props.showBulkActions } ); 

3. Using a variable

let dependentClass = this.props.showBulkActions ? 'show' : 'hidden'; className={`... ${dependentClass }`} 

4. Using clsx

<div className={clsx('...',`${this.props.showBulkActions ? 'show' : 'hidden'}`)}> ... </div> 

I have tried to tailored my answer to include all the best possible solution in the post

There are many different ways of getting this done.

1. Inline inside the class

<div className={`... ${this.props.showBulkActions ? 'show' : 'hidden'}`}> ... </div> 

2. Using the values

var btnClass = classNames( ... { 'show': this.props.showBulkActions, 'hidden': !this.props.showBulkActions } ); 

3. Using a variable

let dependentClass = this.props.showBulkActions ? 'show' : 'hidden'; className={`... ${dependentClass }`} 

4. Using clsx

<div className={clsx('...',`${this.props.showBulkActions ? 'show' : 'hidden'}`)}> ... </div> 
Source Link
krishnaacharyaa
  • 26.1k
  • 9
  • 102
  • 138

I have tried to tailored my answer to include all the best possible solution in the post.

There are many different ways of getting this done.

1. Inline inside the class

<div className={`... ${this.props.showBulkActions ? 'show' : 'hidden'}`}> ... </div> 

2. Using the values

var btnClass = classNames( ... { 'show': this.props.showBulkActions, 'hidden': !this.props.showBulkActions } ); 

3. Using a variable

let dependentClass = this.props.showBulkActions ? 'show' : 'hidden'; className={`... ${dependentClass }`} 

4. Using clsx

<div className={clsx('...',`${this.props.showBulkActions ? 'show' : 'hidden'}`)}> ... </div>