setContext() وgetContext()
وفّر قيم السياق واستهلكها ضمن نطاق شجرة فرعية لمكوّن
setContext() وgetContext() درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ما هو السياق
يتيح السياق للمكوّن الأب تمرير البيانات إلى جميع المكوّنات التابعة له دون تمرير الخصائص عبر كل مستوى.
استيراد الدوال المساعدة
من svelte.
import { setContext, getContext } from "svelte";التعيين في المكوّن الأب
استدعِ setContext(key, value) في script الخاص بالمكوّن الأب.
setContext("theme", { color: "dark" });الحصول عليها في المكوّن التابع
استدعِ getContext(key) في أي مكوّن تابع لقراءتها.
const theme = getContext("theme");المفاتيح
يمكن أن تكون المفاتيح سلاسل نصية أو رموزًا. وتتجنب الرموز التصادمات.
const themeKey = Symbol("theme");اللقطات
تُلتقط القيمة الممررة إلى setContext مرة واحدة. استخدم المخازن للقيم التفاعلية.
السياق التفاعلي
مرّر مخزنًا عبر السياق لتمكين التحديثات التفاعلية في جميع المكوّنات التابعة.
setContext("user", userStore);محصور في الشجرة الفرعية
لا يتوفر السياق إلا للمكوّنات التابعة للمكوّن الذي عيّنه.
سياقات متعددة
يمكن لكل مكوّن تعيين سياقات متعددة، ويمكن للمكوّنات التابعة قراءة أي منها باستخدام مفتاحه.
حالات الاستخدام
السمة، والتدويل، والمصادقة، وحقن التبعيات. أي شيء ينتقل إلى الأسفل دون تمريره خاصيةً تلو الأخرى.
مقارنة بالمخازن
المخازن عامة، أما السياق فمحصور في شجرة المكوّنات التي استُدعي فيها setContext.
تحقق سريع
من يمكنه قراءة السياق؟
مراجعة
استخدم setContext(key, val) وgetContext(key) لمشاركة البيانات عبر شجرة المكوّنات دون استخدام الخصائص.
الأسئلة الشائعة
هل درس «setContext() وgetContext()» مجاني؟
نعم — نص درس «setContext() وgetContext()» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «setContext() وgetContext()»؟
وفّر قيم السياق واستهلكها ضمن نطاق شجرة فرعية لمكوّن تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «setContext() وgetContext()»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- setContext() وgetContext()
- السياق مقابل Stores: متى تستخدم كلًّا منهما
- السياق المعرّف بالأنواع باستخدام TypeScript
- السياق لحقن الاعتماديات