Reactjs if else statement on classes

JavaScript
1

im creating a chat box
and based on the database info the chat has to either appear on the left side or the right side, this needs to be done in CSS
so i have made a 2 classes “ChatmessagesOther” and “ChatmessagesMe”
they both have multiple different styles

my code:

  messages = (
        <div id="ChatArea">
        {
            data.map((chatmessage) =>(
              <div>
                <div className='ChatmessagesOther'>  
                    <p>Date: {chatmessage.date}</p>   
                    <p>{chatmessage.message}</p>   
                </div>
              </div>
            ))
        }
        </div>

based on the bool “chatmessage.helper” it has to choose wich class needs to be used

I know i can change the a single style like this:

 <p style={{ display: chatmessage.helper? 'block' : 'none' }} >Hello</p>

but how do i change an entire class since i can not use a simple normal"if else" statement

2

Exactly the same way,

<Component property={ condition ? "string1" : "string2 } />
3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.