How to add Multiple Conditions to style prop in ReactJS-CodePudding

I have an element like this:

<div
       className={className.wrapper}
       style={
         wrapper
           ? { transform: "translateX(0)" }
           : { transform: "translateX(50em)" }
       }
></div>

I want to add this condition to my style prop too. I need both. EndOfTreatment ? {borderRight: "10px solid green" } : { borderRight: "10px solid red" }

how can I have both in style section?

I tried another approach. like creating classes for them but I have totally different conditions and I don't know what to do.

CodePudding user response：

You can try it like this:

style={{
    transform: wrapper
        ? 'translateX(0)'
        : 'translateX(50em)',
    borderRight: EndOfTreatment
        ? '10px solid green'
        : '10px solid red',
}}