Is there a way to do "if/else if/else" statements ( aka check multiple conditions ) inline in React JSX?

Question

So I know that if I only have one condition to check I can put { condition ? results : elseresults } in JSX instead of the

if (condition) {
  results
} else {
  elseresults
}

in normal Javascript. But is there a way to check multiple conditions, where I would do

if (condition) {
} else if (condition 2) {
} else {
}

in normal JavaScript?

Answer 1

{ condition1 ? result1 : condition2 ? result2 : resultElse }

Same as regular js: https://stackoverflow.com/a/55958241/12270342

Answer 2

You can do:

<>
    {condition && (jsx)}
    {condition2 && (jsx)}
</>

Other thing you can do is:

let jsx;
if (condition) {
    jsx = x
} else if (condition 2) {
    jsx = y
} else {
    jsx = z
}

<>{jsx}</>

Or you can do nested ternaries!