onRenderTracked() تنقيح: تتبع جمع الاعتماديات
آخر تحديث: 2026-10-22
onRenderTracked() تنقيح: تتبع جمع الاعتماديات
تُستدعى onRenderTracked() عند جمع كل اعتمادية تفاعلية أثناء عرض المكوّن، ومع المنقّح يمكن رؤية بوضوح «من الذي جعلني أُعيد العرض».
| المجموعة | خطافات دورة الحياة |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
onRenderTracked((event) => {
console.log(event.type, event.key, event.target)
})
⚙️ الوسائط
| event | حدث التنقيح: الكائن target والخاصية key والنوع type |
|---|
القيمة المُرجعة:لا شيء
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات:
Logs the dependency keys collected during render.
💡 نقاط مهمة
⚠️ تحذير خاصة بالتنقيح في بيئة التطوير: لا تعمل في بنيات الإنتاج، فلا تعتمد عليها في منطق الأعمال.
💡 نصيحة عند تشخيص «لماذا يُعيد هذا المكوّن العرض مرارًا» تكون أكثر فاعلية مع نقاط التوقف في المتصفح.
🏷️ خطافات دورة الحياة ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س هل يمكن رؤيتها في بيئة الإنتاج؟
ج لا، إذ لا يُستدعى الخطاف إلا في بنية التطوير.
س ما علاقتها بـ Vue Devtools؟
ج تستخدم لوحة فحص المكوّنات في Devtools داخليًا معلومات مماثلة، أما الخطافات اليدوية فتناسب سجلات مخصصة أدق.
س هل تؤثر بوضوح على الأداء؟
ج تُستدعى مع كل عرض، وعند كثرة السجلات يُفضَّل تشغيلها مؤقتًا على المكوّنات المشتبه بها فقط.