React Conditional Rendering

Introduction

Example

1/* this renders conditionally */
2function Greeting({ isLoggedIn }) {
3  if (isLoggedIn) {
4    return <h2>Welcome back!</h2>;
5  }
6  return <h2>Please log in.</h2>;
7}

Key Points

• You can use standard JavaScript `if` statements.
• The `&&` operator renders an element if true.
• The ternary operator `? :` acts as an inline if-else statement.
• Returning `null` hides the component completely.