Self-closing
- React Native kursu
- Başlangıç
- Ders 10/116
- 4 dk
Self-closing etiketleri ve boş bileşenleri öğrenirsin.
Self-closing etiketler
Bir etiketin içine hiçbir şey konmayacaksa self-closing biçimde yazılır. Bu, <View /> gibi etiketin sonuna / eklenmesiyle yapılır.
Self-closing yazım, boş bir <View></View> çifti yerine kullanılır; daha kısadır ve okunması kolaydır.
JSX'te her etiket self-closing yazılabilir; yeter ki içine çocuk konmasın.
Self-closing kullanım
Self-closing etiketler boş bir bileşenin kısa yazımıdır. Örneğin bir yer tutucu olarak <View /> yazabilirsin; bu, boş bir kutu çizer.
JSX'te her etiket self-closing olabilir; ancak bir etiketin çocuğu varsa (içinde başka etiket veya metin) self-closing kullanılamaz.
Boş bir View için <View />, dolu bir View için <View>...</View> yazılır.
Uygulama Self-closing ile yaz
App bileşeni yaz. <View> içinde önce boş bir <Text /> (self-closing), sonra <Text>Merhaba</Text> olsun.
Başlangıç kodu
// Self-closing kullan
function App() {
return null;
}Örnek çözüm
function App() {
return (
<View>
<Text />
<Text>Merhaba</Text>
</View>
);
}Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Hangisi self-closing biçimdedir?
- <View /> Doğru cevap
- <View>
- <View>içerik</View>
- <View></View>
Açıklama: <View /> self-closing biçimdir.
2 Self-closing Text
<View>
____
<Text>Dolu</Text>
</View><View>
<Text />
<Text>Dolu</Text>
</View>Açıklama: <Text /> boş bir Text'in self-closing biçimidir.
3 Self-closing kavramlarını eşleştir
| Kavram | Anlamı |
|---|---|
<View /> |
Boş View |
<Text /> |
Boş Text |
</Text> |
Kapanış |
/> |
Self-closing işareti |