onMount: التشغيل بعد التصيير
نفّذ الشيفرة بعد إضافة المكوّن إلى DOM
onMount: التشغيل بعد التصيير درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
الغرض من onMount
يُشغَّل onMount بعد إضافة المكوّن إلى DOM. وهو مثالي لبدء عمل غير متزامن أو للوصول إلى المراجع.
استيراده
استوردوه من svelte في أعلى البرنامج النصي.
<script>
import { onMount } from "svelte";
</script>الاستخدام الأساسي
مرّروا دالة تُشغَّل مرة واحدة عند التركيب.
onMount(() => {
console.log("mounted");
});العمليات غير المتزامنة
يمكنكم استخدام async/await داخله أو إعادة وعد.
onMount(async () => {
data = await fetch("/api").then(r => r.json());
});الوصول إلى العنصر
ادمجوه مع bind:this لمعالجة DOM مباشرة بعد التركيب.
onMount(() => inputEl.focus());دالة التنظيف
أعيدوا دالة من onMount لتنفيذ التنظيف عند إزالة تركيب المكوّن.
onMount(() => {
const id = setInterval(tick, 1000);
return () => clearInterval(id);
});الخادم في مقابل المتصفح
لا يُشغَّل onMount أثناء SSR. استخدموه للبرامج البرمجية الخاصة بالمتصفح فقط، مثل إعداد canvas أو WebGL.
استدعاءات onMount متعددة
يمكنكم استدعاء onMount عدة مرات في المكوّن نفسه. وتُشغَّل الاستدعاءات حسب ترتيب الإعلان.
الاشتراكات
اشتركوا هنا في المصادر الخارجية وألغوا الاشتراك في الدالة المُعادة للتنظيف.
تجنّبوا العمل المكثف
أجّلوا العمل غير الضروري أو استخدموا requestIdleCallback لتجنب حجب الرسم الأول.
الفرق عن beforeUpdate
يُشغَّل onMount مرة واحدة بالضبط، بينما يُشغَّل beforeUpdate قبل كل تحديث تفاعلي.
تحقق سريع
كيف تنظفون مؤقتًا بدأ تشغيله في onMount؟
مراجعة
يُشغَّل onMount مرة واحدة بعد التركيب؛ أعيدوا دالة لتنفيذ التنظيف؛ ولا يُشغَّل مطلقًا على الخادم.
تعلم HTML مع معلم ذكاء اصطناعي — مجانًا
اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.
- الدورات
- 41
- الدروس
- 163
الأسئلة الشائعة
هل درس «onMount: التشغيل بعد التصيير» مجاني؟
نعم — نص درس «onMount: التشغيل بعد التصيير» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «onMount: التشغيل بعد التصيير»؟
نفّذ الشيفرة بعد إضافة المكوّن إلى DOM تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «onMount: التشغيل بعد التصيير»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- onMount: التشغيل بعد التصيير
- onDestroy: التنظيف
- beforeUpdate وafterUpdate
- tick(): انتظار تحديثات DOM