0Pricing
Sveltejs Academy · Pelajaran

setContext() dan getContext()

Sediakan dan gunakan nilai konteks yang cakupannya terbatas pada subtree komponen.

setContext() dan getContext() adalah pelajaran Sveltejs Academy gratis di CoddyKit. Ini adalah pelajaran 1 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.

Apa Itu Konteks

Konteks memungkinkan komponen induk meneruskan data ke semua turunannya tanpa meneruskan properti secara berantai.

Impor Pembantu

Dari svelte.

import { setContext, getContext } from "svelte";

Tetapkan di Komponen Induk

Panggil setContext(key, value) dalam skrip komponen induk.

setContext("theme", { color: "dark" });

Dapatkan di Komponen Turunan

Panggil getContext(key) di komponen turunan mana pun untuk membacanya.

const theme = getContext("theme");

Kunci

Kunci dapat berupa string atau simbol. Simbol menghindari benturan.

const themeKey = Symbol("theme");

Cuplikan

Nilai yang diteruskan ke setContext ditangkap satu kali. Gunakan penyimpanan untuk nilai reaktif.

Konteks Reaktif

Teruskan penyimpanan sebagai konteks untuk mengaktifkan pembaruan reaktif di seluruh komponen turunan.

setContext("user", userStore);

Terbatas pada Subpohon

Konteks hanya tersedia bagi turunan komponen yang menetapkannya.

Beberapa Konteks

Setiap komponen dapat menetapkan beberapa konteks; komponen turunan dapat membaca konteks mana pun berdasarkan kuncinya.

Kasus Penggunaan

tema, lokalisasi, autentikasi, injeksi dependensi. Apa pun yang mengalir ke bawah tanpa diteruskan sebagai properti satu per satu.

Dibandingkan dengan Penyimpanan

Penyimpanan bersifat global; konteks terbatas pada pohon komponen tempat setContext dipanggil.

Pemeriksaan Singkat

Siapa yang dapat membaca konteks?

Ringkasan

Gunakan setContext(key, val) dan getContext(key) untuk berbagi data melalui pohon komponen tanpa properti.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “setContext() dan getContext()” gratis?

Ya — teks lengkap “setContext() dan getContext()” 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 “setContext() dan getContext()”?

Sediakan dan gunakan nilai konteks yang cakupannya terbatas pada subtree komponen. 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 1 dari 4.

Berapa lama pelajaran “setContext() dan getContext()” 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

  1. setContext() dan getContext()
  2. Konteks vs Store: Kapan Menggunakan Masing-Masing
  3. Konteks Bertipe dengan TypeScript
  4. Konteks untuk Injeksi Dependensi
← Kembali ke Sveltejs Academy