Özet - Koşullu render

Giriş yapmış ve misafir kullanıcı için farklı başlık gösteren bir banner yazarsın.

Özet - Koşullu render

Bu grupta koşullu render'ı, ternary operatörü, mantıksal AND desenini ve erken return yöntemini öğrendin. Şimdi bunları birleştirme zamanı.

İki seçenek için ternary, tek taraflı gösterme için &&, kenar durumlar için erken return kullanırsın. Bu üç yöntem çoğu koşullu render ihtiyacını karşılar.

Bir sonraki adımda giriş yapmış ve misafir kullanıcı için farklı başlık gösteren bir banner yazacaksın.

Uygulama Banner iki durum

Aşağıdaki iskeleti tamamla. Banner adında bir bileşen yaz; ({ '{ isLoggedIn }' }) parametresi alsın. isLoggedIn true ise <h1>Hosgeldin</h1>, false ise <h1>Giriş yap</h1> döndürsün (ternary ile). Dışa aktarmayı unutma.

Örnek çözümü göster

function Banner({ isLoggedIn }) {
  return isLoggedIn ? <h1>Hosgeldin</h1> : <h1>Giriş yap</h1>;
}

export default Banner;

Kendini test et

İki seçenek için en iyi yöntem hangisi?
- Ternary
- &&
- Erken return
- if deyimi
Cevabı göster

Ternary — Ternary iki seçenek için idealdir.
Koşullu render yöntemlerini eşleştir

Ternary

İki seçenek
&&

Tek taraflı
Erken return

Kenar durum
null

Çizilmez

Sıradaki ders: Liste render nedir?

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler