navigate

navigation.navigate ile geçiş yapmayı öğrenirsin.

navigate fonksiyonu

Bir ekrandan diğerine geçmek için navigation.navigate('EkranAdi') çağrısı yaparsın. Bu, hedef ekranı yığının üstüne ekler. navigation nesnesi, stack içindeki her ekran bileşenine otomatik olarak props olarak geçirilir.

Bir Button veya Pressable bileşeninin onPress olayında navigate çağırarak geçişi tetiklersin. Örneğin: onPress={() => navigation.navigate('Details')}. Hedef ekran adı, Stack.Screen'in name özniteliğiyle birebir eşleşmelidir.

Uygulama Sıra sende: Details'a geç butonu ekle

HomeScreen bileşenine bir Button ekle. Butona basıldığında navigation.navigate('Details') çağrılsın. navigation prop'unu bileşen parametrelerinden al.

Örnek çözümü göster

function HomeScreen({ navigation }) {
  return (
    <View>
      <Text>Ana sayfa</Text>
      <Button
        title="Detaylar"
        onPress={() => navigation.navigate('Details')}
      />
    </View>
  );
}

navigation prop

Stack içindeki her ekran bileşeni, otomatik olarak bir navigation prop'u alır. Bu prop, navigate, goBack, setParams gibi işlevler içerir. Bileşen parametresinden destructuring ile çıkarabilirsin: function HomeScreen({ navigation }).

Eğer ekranın route bilgisi de gerekiyorsa (örneğin geçilen parametreleri okumak için), ikisini birlikte alabilirsin: function Screen({ navigation, route }). Bu iki prop React Navigation tarafından otomatik enjekte edilir; manuel olarak geçirmezsin.

Kendini test et

navigation.navigate('Details') ne yapar?
```
navigation.navigate('Details')
```
- Details ekranını yığının üstüne ekler
- Uygulamayı kapatır
- Details ekranını yığından çıkarır
- Tüm ekranları siler
Cevabı göster

Details ekranını yığının üstüne ekler — navigate hedef ekranı yığının üstüne ekler.

Boşluğu doldur: Details'a geç

navigation.____('Details');

Cevabı göster

navigation.navigate('Details');

Eşleştir: işlev ve etkisi

navigate

yeni ekran ekler
goBack

önceki ekrana döner
setParams

parametre günceller

Sıradaki ders: params

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler