onBeforeUpdate() خُطاف ما قبل التحديث
آخر تحديث: 2026-10-22
onBeforeUpdate() خُطاف ما قبل التحديث
تُستدعى onBeforeUpdate() بعد تغيّر البيانات التفاعلية وقبل تحديث DOM مباشرة: عندئذ يمكن قراءة حالة DOM قبل التحديث.
| المجموعة | خطافات دورة الحياة |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
onBeforeUpdate(() => {
// لا يزال DOM في حالته القديمة
})
⚙️ الوسائط
| callback | الدالة التي تُنفَّذ قبل التحديث |
|---|
القيمة المُرجعة:لا شيء
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات:
Each click records the stale DOM first, then the view refreshes.
💡 نقاط مهمة
ℹ️ ملاحظة استخدامها قليل التواتر: معظم متطلبات «القراءة قبل التحديث» يغطيها watch مع watchPostEffect.
⚠️ تحذير تعديل البيانات هنا يُطلق جولة تحديث إضافية ويسهل تشكيل حلقة، فكن حذرًا في الإسناد.
🏷️ خطافات دورة الحياة ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س أيّهما أولًا: هذا الخطاف أم تحديث DOM؟
ج الخطاف أولًا: يحدث تحديث DOM بعده مباشرة، فما يُقرأ هنا هو DOM القديم.
س هل يمكن منع التحديث هنا؟
ج لا، فـ Vue لا يوفّر آلية إلغاء؛ وإذا احتجت عرضًا شرطيًا فاستخدم v-if.
س ما الفرق بينها وبين watch مع flush: 'pre'؟
ج التوقيت نفسه (قبل DOM)، لكن watch تستمع إلى بيانات محددة وتوفّر القيمتين القديمة والجديدة، بينما هذا الخطاف بلا معاملات.