Memeriksa Konten Slot dengan $$slots
Periksa $$slots untuk merender markup pembungkus secara kondisional hanya saat slot digunakan.
Memeriksa Konten Slot dengan $$slots adalah pelajaran Sveltejs Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Sveltejs Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Sveltejs Academy mencakup 4 pelajaran total.
Mengapa Memeriksa Slot
Terkadang Anda hanya ingin merender markup pembungkus (batas, bagian atas) jika slot memiliki konten.
Objek slots
Di dalam komponen, $$slots adalah objek dengan satu properti untuk setiap slot yang diisi.
Bernilai Benar Saat Diisi
Jika slot memiliki konten, kuncinya di dalam $$slots bernilai benar.
{#if $$slots.title}<h2><slot name="title" /></h2>{/if}Hindari Pembungkus Kosong
Lewati perenderan markup pembungkus ketika slot kosong agar DOM tetap bersih.
Gabungkan dengan Nilai Bawaan
Anda dapat memilih antara konten cadangan dan melewati pembungkus sepenuhnya.
Deteksi Reaktif
$$slots diperbarui secara reaktif jika pengisian slot berubah di antara proses perenderan.
Gunakan dengan Beberapa Slot
Periksa setiap slot bernama secara terpisah.
{#if $$slots.header || $$slots.footer}...Umum pada Kartu
Kartu dengan judul atau bagian bawah opsional sering menggunakan pola ini.
Kunci Slot Bawaan
Slot bawaan muncul di bawah $$slots.default.
{#if $$slots.default}<div class="body"><slot /></div>{/if}TypeScript
Pengguna TypeScript dapat mendeklarasikan tipe $$Slots untuk mendapatkan pelengkapan otomatis pada $$slots.
Kompromi
Ini menambahkan percabangan ke markup Anda, tetapi menghasilkan keluaran yang lebih bersih. Hal ini sepadan untuk sistem desain.
Pemeriksaan Singkat
Apa yang diperiksa oleh $$slots.header?
Ringkasan
Gunakan $$slots.name untuk mendeteksi apakah komponen induk mengisi suatu slot, lalu lewati markup pembungkus jika tidak.
Belajar HTML dengan tutor AI — gratis
Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.
- Kursus
- 41
- Pelajaran
- 163
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Memeriksa Konten Slot dengan $$slots” gratis?
Ya — teks lengkap “Memeriksa Konten Slot dengan $$slots” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Sveltejs Academy, upgrade ke CoddyKit PRO. Kursus Sveltejs Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “Memeriksa Konten Slot dengan $$slots”?
Periksa $$slots untuk merender markup pembungkus secara kondisional hanya saat slot digunakan. Kamu berlatih Sveltejs Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai Sveltejs Academy?
Tidak diperlukan pengalaman sebelumnya. Sveltejs Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.
Berapa lama pelajaran “Memeriksa Konten Slot dengan $$slots” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran Sveltejs Academy ini?
Ya. Setiap pelajaran Sveltejs Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Slot Bawaan untuk Proyeksi Konten
- Slot Bernama dengan slot="name"
- Konten Cadangan Slot
- Memeriksa Konten Slot dengan $$slots