From be5e3c5ef4212ebd37fa975e17129a9684d0c75e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Wed, 20 Aug 2014 12:45:04 -0700
Subject: [PATCH] Merge pull request #2076 from whatasunnyday/master

Add example to if else in JSX.
---
 docs/tips/03-if-else-in-JSX.md | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/docs/tips/03-if-else-in-JSX.md b/docs/tips/03-if-else-in-JSX.md
index 5a04c9f60e..91105b655a 100644
--- a/docs/tips/03-if-else-in-JSX.md
+++ b/docs/tips/03-if-else-in-JSX.md
@@ -39,4 +39,25 @@ That's not valid JS. You probably want to make use of a ternary expression:
 React.renderComponent(<div id={condition ? 'msg' : ''}>Hello World!</div>, mountNode);
 ```
 
+If a ternary expression isn't robust enough, you can use `if` statements to determine which 
+components should be used.
+
+```js
+/** @jsx React.DOM */
+
+var loginButton;
+if (loggedIn) { 
+  loginButton = <LogoutButton />; 
+} else { 
+  loginButton = <LoginButton />; 
+}
+
+return (
+  <nav>
+    <Home />
+    {loginButton}
+  </nav>
+)
+```
+
 Try using it today with the [JSX compiler](/react/jsx-compiler.html).