useAttrs() الحصول على الخصائص المُمرَّرة
آخر تحديث: 2026-10-22
useAttrs() الحصول على الخصائص المُمرَّرة
تُعيد useAttrs() الخصائص المُمرَّرة غير المصرَّح بها في props/emits (مثل class وid ومستمعي الأحداث)، وتُستخدم للتوزيع اليدوي.
| المجموعة | القوالب والمساعدات |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.0+ |
| دعم SSR | مدعوم |
📝 الصيغة
const attrs = useAttrs()
// القالب: <div v-bind="attrs"></div>
القيمة المُرجعة:كائن تفاعلي (لا يستجيب للتغييرات اللاحقة، لكن يمكن قراءة أحدث قيمة منه)
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات:
The button carries both classes and the data attribute.
💡 نقاط مهمة
ℹ️ ملاحظة عند عدم التصريح بـ props تسقط الخصائص المُمرَّرة افتراضيًا على العنصر الجذر تلقائيًا؛ وتُستخدم هذه الدالة فقط عند الحاجة إلى إنزالها على عنصر داخلي غير جذري.
⚠️ تحذير لا تحاول تعديل attrs: فهي للقراءة فقط، والتعديل يُصدر تحذيرًا دون فائدة.
💡 نصيحة تُستخدم مع inheritAttrs: false: أي إيقاف التمرير التلقائي ثم التوزيع يدويًا بدقة.
🏷️ القوالب والمساعدات ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س ما الفرق بينها وبين $attrs؟
ج نسخة الـ API التركيبية، والوظيفة نفسها؛ أما $attrs فهي صيغة القالب/النسخة.
س هل تتزامن attrs مع تحديث المكوّن الأب؟
ج تتزامن إلى أحدث قيمة، لكن الكائن بذاته ليس تفاعليًا بعمق (القيم الداخلية لا تُطلق تتبع الاعتماديات).
س متى يصبح التوزيع اليدوي ضروريًا؟
ج عندما يكون للمكوّن عدة عناصر جذرية، أو عند الحاجة إلى وضع الخصائص على عنصر داخلي محدد.