withModifiers() تغليف مُعدّلات الأحداث
آخر تحديث: 2026-10-22
withModifiers() تغليف مُعدّلات الأحداث
تضيف withModifiers() سلوك المُعدّلات (stop و prevent و once وغيرها) إلى دوال معالجة الأحداث داخل دوال التصيير.
| المجموعة | دوال العرض و SSR |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
h("button", { onClick: withModifiers(fn, ["prevent", "stop"]) }, "إرسال")⚙️ الوسائط
| handler, modifiers | دالة معالجة الحدث + مصفوفة أسماء المُعدّلات |
|---|
القيمة المُرجعة：دالة معالجة الأحداث بعد التغليف
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات：
Inner clicks stop at the inner handler; outer clicks log the outer one.💡 نقاط مهمة
ℹ️ ملاحظة المُعدّلان .stop/.prevent في القالب يُترجمان إلى استدعاء لهذه الدالة، بالسلوك نفسه تماماً.
💡 نصيحة استخدمها عند حاجتك للمُعدّلات في دوال التصيير المكتوبة يدوياً أو المكوّنات ذات الرتبة الأعلى.
⚠️ تحذير أسماء المُعدّلات تُكتب بالصيغة القصيرة: 'stop' و 'prevent' و 'self' و 'once'؛ ومُعدّلات المفاتيح تُكتب مثل 'enter'.
🏷️ دوال العرض و SSR ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س هل تُستخدم في القوالب أيضاً؟
ج لا حاجة، فالقالب يوفر سكر نحوي مثل @click.stop.
س هل يمكن تكديس عدة مُعدّلات؟
ج نعم: ['prevent', 'stop']، وتُفعَّل بالترتيب.
س ما الفرق عن كتابة e.stopPropagation() يدوياً؟
ج التأثير نفسه، و withModifiers أقصر ومتوافقة مع سلوك القوالب.
