Varsayılan ve Adlandırılmış Snippet'ler
Bir bileşende yedek snippet'ler sağlayın ve birden fazla snippet yuvasını adlandırın.
Varsayılan ve Adlandırılmış Snippet'ler, CoddyKit'te ücretsiz bir Sveltejs Academy dersidir. Bu, 4 dersinin 4. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Sveltejs Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Sveltejs Academy kursu toplamda 4 dersten oluşur.
Varsayılan Parçacık
Bir bileşenin etiketleri arasına yerleştirilen içerik varsayılan parçacık olur ve children aracılığıyla erişilebilir.
<Card>
<p>Inside the card</p>
</Card>Bileşenin İçinde
Varsayılan içeriği children özelliğiyle oluşturun.
let { children } = $props();
<div class="card">
{@render children()}
</div>Adlandırılmış Parçacıklar
Birden çok parçacığı adlarını özellik olarak kullanarak iletin.
<Card>
{#snippet header()}<h2>Title</h2>{/snippet}
{#snippet body()}<p>Text</p>{/snippet}
</Card>Adlandırılmış Olanları Alma
Adlandırılmış her parçacığı bir özellik olarak bildirin.
let { header, body } = $props();
{@render header()}
{@render body()}Yedek İçerikler
Normal koşullu ifadeleri kullanarak varsayılan yedek içerik sağlayın.
{#if header}{@render header()}{:else}<h2>Default</h2>{/if}Tür Güvenliği
IDE desteği için her parçacık parametresine açıkça tür verin.
Adlandırılmış Yuvaları Değiştirme
Parçacıklar, Svelte 4'teki adlandırılmış yuva deseninin yerini daha güçlü bir çözümle alır.
Varsayılan İçerik
Parçacıklarda yerleşik yedek içerik yoktur; bunun için {#if} kullanın.
Bileşim Desenleri
Başsız bileşen tasarımları için varsayılan ve adlandırılmış parçacıkları birleştirin.
Geçiş İpucu
Geçiş yaparken her adlandırılmış yuvayı adlandırılmış bir parçacık özelliğine dönüştürün.
TS Tür Çıkarımı
Svelte 5, bileşeninizin özelliklerinden Snippet türlerini otomatik olarak oluşturur.
Kısa Kontrol
Svelte 5'te adlandırılmış yuvaların yerini ne alır?
Özet
Varsayılan içerik children parçacığını kullanır; adlandırılmış parçacıklar açık özelliklerdir ve @render ile oluşturulur.
Yapay zeka eğitmeniyle HTML öğren — ücretsiz
Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.
- Kurslar
- 41
- Dersler
- 163
Sıkça Sorulan Sorular
“Varsayılan ve Adlandırılmış Snippet'ler” dersi ücretsiz mi?
Evet — “Varsayılan ve Adlandırılmış Snippet'ler” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Sveltejs Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Sveltejs Academy kursu toplamda 4 dersten oluşur.
“Varsayılan ve Adlandırılmış Snippet'ler” dersinde ne öğreneceğim?
Bir bileşende yedek snippet'ler sağlayın ve birden fazla snippet yuvasını adlandırın. Sveltejs Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Sveltejs Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Sveltejs Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 4. dersidir.
“Varsayılan ve Adlandırılmış Snippet'ler” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Sveltejs Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Sveltejs Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Türlü Özellikler için $props()
- {#snippet} ve {@render}
- Snippet'leri Özellik Olarak Aktarma
- Varsayılan ve Adlandırılmış Snippet'ler