Question

0

246

Vistas

How to nest if-else inside an if in JSX syntax using ternary?

I'm trying to achieve the following in JSX:

if (declineButtonMessage) {
    if (buttonDirection === 'column') {
        render button 1
    } else {
        render button 2
    }
}

I have this so far:

{declineButtonMessage && (
    
)}

And I tried smuggling this inside:

buttonDirection === 'column' ? <StyledDeclineButton buttonDirection={buttonDirection} title={declineButtonMessage} wide onPress={onSecondaryAction} /> : <SecondaryButton buttonDirection={buttonDirection} title={declineButtonMessage} wide onPress={onSecondaryAction} />

But it wasn't working and my linter was going wild. I imagine I'm doing some sort of JSX syntax error

about 4 years ago · Juan Pablo Isaza

2 Respuestas

Responde la pregunta

0

Responde la pregunta

Encuentra empleos remotos

Answer 1 · 2022-06-24T18:00:34.059Z

This should help you

{
  declineButtonMessage 
    ? (buttonDirection === 'column' ? <button1 /> : <button2 />)
    : null
}

Answer 2 · 2022-06-24T18:00:34.072Z

{!!declineButtonMessage && (buttonDirection === 'column' ? <button1 /> : <button2 />)}

Try this pls

0

246

How to nest if-else inside an if in JSX syntax using ternary?

2 Respuestas

0

0

Encuentra empleos remotos

Andres GPT