Conditional Rendering: Inline If-Else with Conditional Operator

render() {
  const isLoggedIn = this.state.isLoggedIn;
  return (
    <div>
      {isLoggedIn ? (
        <LogoutButton onClick={this.handleLogoutClick} />
      ) : (
        <LoginButton onClick={this.handleLoginClick} />
      )}
    </div>
  );
}

You can use the JavaScript conditional operator 'condition ? true : false'  for conditionally rendering elements inline.

Conditional Rendering: Inline If-Else with Conditional Operator — Structure map

Clickable & Draggable!

Conditional Rendering: Inline If-Else with Conditional Operator — Related pages: