<Suspense> انتظار الاعتماديات غير المتزامنة
آخر تحديث: 2026-10-22
<Suspense> انتظار الاعتماديات غير المتزامنة
يعرض
| المجموعة | المدمجات |
|---|---|
| النوع | مكوّن / عنصر |
| النطاق | القالب |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
<Suspense>
<template #default><AsyncChild /></template>
<template #fallback><p>Loading…</p></template>
</Suspense>
⚙️ الوسائط
| props | #default (المحتوى غير المتزامن) و#fallback (يُعرض أثناء الانتظار) |
|---|
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات:
Shows 'Loading…' then swaps to 'Async content ready' after ~0.8s.
💡 نقاط مهمة
⚠️ تحذير لا يزال تجريبيًا — قد تتغيّر صياغته بين الإصدارات.
ℹ️ ملاحظة ينتظر أقرب الاعتماديات غير المتزامنة؛ والتداخل (التعشيش) يعالج الأعمق منها.
💡 نصيحة يُستخدم عادةً مع مكوّنات المسارات الكسولة (lazy).
🏷️ المدمجات ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س ما الفرق بينه وبين علم تحميل (loading flag) يدوي؟
ج يستجيب Suspense لجاهزية المحتوى تلقائيًا دون أعلام يدوية.
س هل يعمل مع SSR؟
ج ينتظر SSR المحتوى غير المتزامن قبل توليد HTML.
س كيف تُعالج الأخطاء؟
ج التقط الأخطاء عبر onErrorCaptured؛ فـ Suspense ليس حدًّا للأخطاء (error boundary).