Props Aktarma
Coddy'nin React Journey'sinin Temeller bölümünün bir parçası — ders 17 / 42.
Bir prop'u uçtan uca bağlayalım. Üç adım, her zaman aynı:
// 1. onu al
function Greeting({ name }) {
// 2. onu kullan
return <p>Hello, {name}!</p>;
}
// 3. onu geçir
<Greeting name="Ada" />String'ler tırnak içinde aktarılır. Sayılar ve ifadeler süslü parantez kullanır, niteliklerle aynı kural geçerlidir:
<Score points={97} />
Görev
BaşlangıçGreeting bileşeni ona gönderdiğiniz her şeyi yok sayıyor.
Greetingbileşeninin birnameprop'u almasını ve paragrafındaHello, {name}!render etmesini sağlayın.- App içinde
name="Ada"değerini geçirin, böylece sayfaHello, Ada!göstersin.
Kendin dene
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div id="root"></div>
<script type="module" src="main.jsx"></script>
</body>
</html>
Kendini test etBu ders kısa bir quiz içerir. Soruları yanıtlamak ve ilerlemeni kaydetmek için derse başla.