React Props Nedir? Bileşenler Arası Veri Aktarımı

Props (properties kelimesinin kısası), bir React bileşenine dışarıdan veri göndermenin yoludur. Tıpkı bir fonksiyona argüman geçmek gibi, bir bileşene props geçersin.

Props nasıl kullanılır?

function Selam(props) {
  return <h1>Merhaba, {props.ad}!</h1>;
}

// Kullanım:
<Selam ad="Kuzey" />

Burada ad="Kuzey" ile gönderilen değer, bileşen içinde props.ad olarak okunur ve ekrana ‘Merhaba, Kuzey!’ yazılır.

Kısaltılmış yazım (destructuring)

Props'u doğrudan parametrede açmak daha okunabilirdir:

function Selam({ ad }) {
  return <h1>Merhaba, {ad}!</h1>;
}

Props salt okunurdur

Bir bileşen kendisine gelen props'u değiştiremez; yalnızca okur. Değişen veri için props değil, useState ile yönetilen state kullanılır.

Props ile state farkı

Props dışarıdan gelir ve bileşen tarafından değiştirilemez. State ise bileşenin kendi içindeki, değişebilen verisidir. İkisi birlikte React'in veri akışını oluşturur.