CODEWITHSUNDEEP
reactjs
IWI
IWI

Reputation: 1604

Conditional within a conditional

I am trying to put a conditional statement within a conditional statement (something i thought was simple) in my code.

What is want is if weekState (boolean) is true, and bool is true, show the first jsx element. If weekState is true and bool is false, show the second jsx element. If weekState is false, return null. Semms pretty simple, but im obviously missing something.

       { weekState ?
           { bool ?
               <TableRow>
                   {take(weekListForAllAdvisorsOfState, 14)}
               </TableRow>
               :
               <TableRow>
                   {take(weekListForAllAdvisorsOfState, 7)}
               </TableRow> 
           }
            : null
       }

I have looked at this, and this which should have solved my issue, and makes me think theres a syntax error im not seeing.

The error im getting is enter image description here

Upvotes: 0

Views: 69

Answers (2)

cbr
cbr

Reputation: 13662

There is a pair of unnecessary curly braces in the expression after ?. Either remove them, or change them for parentheses ():

{weekState ? (
  bool ? (
    <TableRow>{take(weekListForAllAdvisorsOfState, 14)}</TableRow>
  ) : (
    <TableRow>{take(weekListForAllAdvisorsOfState, 7)}</TableRow>
  )
) : null}

Upvotes: 1

Thomas L
Thomas L

Reputation: 330

I think adding a Fragment should fix this:

{ weekState ?
        <React.Fragment>
           { bool ?
               <TableRow>
                   {take(weekListForAllAdvisorsOfState, 14)}
               </TableRow>
               :
               <TableRow>
                   {take(weekListForAllAdvisorsOfState, 7)}
               </TableRow> 
           }
            
          </React.Fragment>
          : null
       }

Upvotes: 0

Related Questions