React Suspense comes handy when you want to show an indication to user that something is loading in your app. Loader is the simplest example for a Suspense component. Let’s deep dive into the details of Suspense.
Your components will often need to display different things depending on different conditions. In React, you can conditionally render JSX using JavaScript syntax like if statements, &&, and ? : operators.
&& operator
{ isYes && <A />}
? : operator
isYes ? Yes() : No()
- In React, you control branching logic with JavaScript.
- You can return a JSX expression conditionally with an if statement.
- You can conditionally save some JSX to a variable and then include it inside other JSX by - using the curly braces.
- In JSX,
{cond ? <A /> : <B />}means “if cond, render<A />, otherwise<B />. - In JSX,
{cond && <A />}means “if cond, render<A />, otherwise nothing”. - The shortcuts are common, but you don’t have to use them if you prefer plain if.
What are your thoughts on this post?
I’d love to hear from you! Click this link to email me—I reply to every message!
Also use the share button below if you liked this post. It makes me smile, when I see it.