opendevs
Props and States

Conditional Rendering

Loading video...

Conditional Rendering in React (in Hindi)

Concepts

    1

    Conditional Rendering in React (in Hindi)
    Conditional Rendering in React (in Hindi)
In React, we can create distinct components that encapsulate behavior we need. Then, we can render only some of them, depending on the state of the application. Conditional rendering in React works the same way conditions work in JavaScript. Use JavaScript operators like if or the conditional operator to create elements representing the current state, and let React update the UI to match them.Finish watching the concept videos to earn    DevCoin image  each
1

What are the ways you can conditionally render a component?


Question 1 of 5
2

What will be the output of the following code?

const isLoggedIn = true; isLoggedIn ? <p>Hello</p> : <p>Please login</p>;

Question 1 of 5
3

Will the following alert be popped?

(8 < 4) && alert('!!!! Hello Dev11 !!!!')

Question 1 of 5
4

React conditional rendering is similar to javascript conditional rendering?


Question 1 of 5
5

Is the following code valid?

{(function() { if (isLoggedIn) { return <button>Logout</button>; } else { return <button>Login</button>; } })()}

Question 1 of 5
Practice Problems
StatusTitleDifficultyDevCoin image

easy

easy

Copyright © 2022 opendevs

Learn ● Develop ● Ace
All illustrations by Storyset