ReactJs - Creating an “If” component… a good idea?

Question

I\'ve read in the React docs that \"if\" type statements can\'t be used in JSX code, because of the way JSX renders into javascript, it doesn\'t work out as one would expect

Answer 1

For me is enough taking advantage of the lazy evaluation in a logic expression if no else statement is needed:

render() {
    return(
        

             {
                 condition &&
                     Displayed if condition is true
             }
        
    );    
}

Or the ternay operator if an else is needed:

render() {
    return(
        

             {
                 condition ?
                     Displayed if condition is true
                          :
                     Displayed if condition is false
             }
        
    );    
}