Latihan 1 dari materi Slots Svelte di Svelte — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kode awal sudah punya komentar <!-- Ini adalah file Card.svelte -->, <div class="card"> berisi komentar TODO, dan <style> untuk .card. Biarkan semuanya.
Di dalam <div class="card">, ganti komentar TODO dengan slot default yang punya fallback: <slot>Konten default</slot>.
Tulis slot-nya dengan tag pembuka dan tag penutup, bukan <slot />, karena teks cadangannya harus berada di antara keduanya.
Yang dicek:
Halaman punya elemen .card.
Kodemu menyebut <slot. Tulisan di dalam komentar gak dihitung.
Ada <slot> dengan isi di antara tag pembuka dan </slot>.
Teks di .card memuat Konten default. Latihannya merender Card tanpa induk, jadi yang tampil adalah fallback-nya.
Hint
Komponen anak menyediakan lubang lewat <slot>, dan isi di antara tag pembuka dan penutupnya tampil kalau induknya gak mengirim apa-apa.
Taruh satu <slot> dengan tag pembuka dan penutup di dalam div card, lalu tulis teks cadangannya di antara keduanya.