İlk bileşen

View ve Text ile ilk bileşeni yazmayı öğrenirsin.

View ve Text

View, React Native'in en temel konteyner bileşenidir. Bir <div> gibi düşün; içine başka bileşenler koyarsın. Text ise ekranda metin gösterir; tıpkı bir <p> gibi.

Bu ikisi react-native paketinden içe aktarılır: import { View, Text } from 'react-native';.

Bileşen adları her zaman büyük harfle başlar; bu sayede React onları HTML etiketlerinden ayırt eder.

İç içe bileşenler

React Native'de bileşenler iç içe geçebilir. Bir <View> içine başka <View> veya <Text> koyabilirsin. Bu, bileşen ağacının temelidir.

Her açılış etiketinin bir kapanış etiketi olmalıdır. Boş bir etiket ise <View /> gibi kendini kapatan biçimde yazılır.

İç içe geçmiş yapı, ekranı mantıksal parçalara bölmeni sağlar.

Uygulama İç içe bileşen yaz

App bileşeni yaz. <View> içine iki <Text> yerleştir: birincide Başlık, ikincide Açıklama yazsın.

Örnek çözümü göster

function App() {
  return (
    <View>
      <Text>Başlık</Text>
      <Text>Açıklama</Text>
    </View>
  );
}

Kendini test et

Kapanış etiketi

<View>
  <Text>Merhaba</Text>
____>

Cevabı göster

<View>
  <Text>Merhaba</Text>
</View>

Text bileşenini View içine nasıl yerleştirirsin?
- <Text><View>Merhaba</View></Text>
- <View><Text>Merhaba</Text></View>
- <View Text>Merhaba</View>
- <View><Text Merhaba /></View>
Cevabı göster

<View><Text Merhaba /></View> — Text, View'un içinde yer alır.
Bileşenleri eşleştir

View

Konteyner
Text

Metin
import

İçe aktarma
export

Dışa aktarma

Sıradaki ders: App.js

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler