CODEWITHSUNDEEP
javascriptreactjs
Matius Nugroho Aryanto
Matius Nugroho Aryanto

Reputation: 901

React : Text and ternary combination not working

I want to display class of a div depends on the state of isAddingVarian or isEditingVarian if both of them is true the class will be float-right d-one and if false it will be float-right. i know i can do like this

<div class={isAddingVarian || isEditingVarian?'float-right d-none':'float-right'}>

but i want something like this 

<div class={"float-right "+isAddingVarian || isEditingVarian?"d-none":''}>

how can i do that?

Upvotes: 0

Views: 65

Answers (2)

ruggierom
ruggierom

Reputation: 109

The way you have it set up you will never make it to your ternary expression, a string containing chars will always be true, and the || operator returns the first true value.

You just need to rethink the logic and set it up differently.

Upvotes: 1

Roberto Rodriguez
Roberto Rodriguez

Reputation: 3347

Try this

<div className={`float-right ${isAddingVarian || isEditingVarian? "d-none":''} `}></div>

Upvotes: 3

Related Questions