onErrorCaptured() الإمساك بأخطاء المكوّنات الأبناء
آخر تحديث: 2026-10-22
onErrorCaptured() الإمساك بأخطاء المكوّنات الأبناء
تُمسك onErrorCaptured() الأخطاء التي تطرحها المكوّنات الأبناء أثناء العرض/دورة الحياة/الاستماع، ويمكنها منع استمرار تفشّي الخطأ صعودًا.
| المجموعة | خطافات دورة الحياة |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
onErrorCaptured((err, instance, info) => {
console.error(err)
return false // إعادة false تمنع الاستمرار في الانتشار صعودًا
})⚙️ الوسائط
| err | كائن الخطأ |
|---|---|
| instance | نسخة المكوّن التي أطلقت الخطأ |
| info | وصف مصدر الخطأ (render / mounted hook وغيرها) |
القيمة المُرجعة：إعادة false تمنع استمرار الخطأ في الانتشار صعودًا
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات：
The page shows 'caught: child exploded' without a blank screen.💡 نقاط مهمة
💡 نصيحة من الممارسات الشائعة الإمساك بالأخطاء في المكوّن الجذري والإبلاغ عنها إلى منصة المراقبة (مثل Sentry).
⚠️ تحذير حتى بعد الإمساك بالخطأ يجب معالجته: فالاكتفاء بالتسجيل دون معالجة يحجب المشكلة ويؤدي إلى فشل صامت.
ℹ️ ملاحظة إعادة false تمنع استمرار التفشّي؛ وإلا استمر الخطأ إلى الطبقات العليا ومعالج errorHandler العام.
🏷️ خطافات دورة الحياة ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س هل تُمسك الأخطاء في الطلبات غير المتزامنة داخل المكونات الأبناء؟
ج لا: إنها تُمسك فقط الأخطاء المتزامنة المطرودة في العرض وخطافات دورة الحياة والمستمعين؛ أما رفض Promise فيجب معالجته ذاتيًا.
س ما علاقتها بـ errorHandler العام؟
ج يتفشّى الخطأ أولًا إلى أقرب نقطة إمساك عليا: فإذا أُعيد return false هنا فلن يصل إلى المعالج العام.
س كيف نكتب مكوّن حدّ أخطاء؟
ج يكفي تغليف طبقة أب باستخدام onErrorCaptured مع عرض شرطي لواجهة احتياطية.
