if-else statement inside jsx: ReactJS

Question

I need to change render function and run some sub render function when a specific state given,

For example:

render() {
    return (   
        

        

Answer 1

There's a Babel plugin that allows you to write conditional statements inside JSX without needing to escape them with JavaScript or write a wrapper class. It's called JSX Control Statements:

  
    data
  

It takes a bit of setting up depending on your Babel configuration, but you don't have to import anything and it has all the advantages of conditional rendering without leaving JSX which leaves your code looking very clean.