0 Tage Serie
javascript / beginner
Snippet

Bedingtes Rendering mit Ternary

Bedingtes Rendering in React funktioniert genau wie JavaScript-Bedingungen. Der Ternary-Operator (?) ist ein prägnanter Weg, um verschiedene Elemente basierend auf einem booleschen Wert zu rendern.

snippet.js
javascript
1
2
3
4
5
return (
<div>
{isLoggedIn ? <LogoutButton /> : <LoginButton />}
</div>
);
react
Erklärung
1
isLoggedIn ?
Prüft, ob die Variable 'isLoggedIn' wahr ist.
2
: <LoginButton />
Der Code nach dem Doppelpunkt wird ausgeführt, wenn die Bedingung falsch ist.