meteor - Avoiding If statements in render method -

i new , unfamiliar web development.

in side project keep ending these if statements in render() method when trying control render based on different things.

one example...

app = react.createclass({     getinitialstate(){         return {validcode: false};     },      handlesubmit(code){         var result = meteor.call('validatecode', code);         this.setstate({validcode: result});     },      render() {          if(this.state.validcode){             return (                 <div>                     <h1>valid code!!</h1>                     <menu />                     <othercomponentsonlyvisiblewhenauthorized />                 </div>             );         }         else {             return (                 <div>                     <h1>welcome</h1>                     <invitecodeinput oncodesubmit={this.handlesubmit}/>                 </div>             );         }     } }); 

basically want validate user input. based on that, either want display rest of web page components in normal fashion or continue display input form component.

i feel having if statement in render darn ugly. have never seen react snippet similar guessing no-no. can familiar react suggest better way?

tbh, don't think matters , i'm sure there heaps of components written this. here example reddit https://github.com/reddit/reddit-mobile/blob/master/src/views/components/listing.jsx

if must take outside of render create method it

app = react.createclass({     getinitialstate(){         return {validcode: false};     },      handlesubmit(code){         var result = meteor.call('validatecode', code);         this.setstate({validcode: result});     },      rendervalidpage() {         return (             <div>                 <h1>valid code!!</h1>                 <menu />                 <othercomponentsonlyvisiblewhenauthorized />             </div>         );      },      renderinvalidpage() {         return (             <div>                 <h1>welcome</h1>                 <invitecodeinput oncodesubmit={this.handlesubmit}/>             </div>         );     }      render() {         return this.state.validcode ? rendervalidpage() : renderinvalidpage();     } });