useId() توليد معرّف فريد مستقر
آخر تحديث: 2026-10-22
useId() توليد معرّف فريد مستقر
تُعيد useId() سلسلة معرّف فريدة ومستقرة لكل نسخة مكوّن: تُستخدم لخصائص الوصولية مثل label/for وربط aria، وتضمن تطابق SSR مع مخرجات العميل.
| المجموعة | القوالب والمساعدات |
|---|---|
| النوع | API |
| النطاق | داخل المكوّن |
| إصدار Vue | 3.5+ |
| دعم SSR | مدعوم |
📝 الصيغة
const id = useId()
// <label :for="id">الاسم</label><input :id="id">
القيمة المُرجعة:سلسلة معرّف فريدة (مستقرة داخل النسخة نفسها)
▶ مثال
عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:
المخرجات:
Each instance gets a distinct ID; clicking a label focuses its input.
💡 نقاط مهمة
💡 نصيحة استخدمها عند كتابة مكوّنات النماذج/النوافذ المنبثقة الصديقة للوصولية، متجنّبًا المعرفات العشوائية اليدوية التي تُحدث عدم اتساق في SSR.
⚠️ تحذير تُعيد الاستدعاءات المتعددة داخل المكوّن نفسه قيمًا مختلفة (كل نقطة استدعاء مستقلة)؛ وإذا احتجت إلى إعادة استخدام القيمة نفسها فخزّنها في متغير.
ℹ️ ملاحظة مضافة في 3.5+؛ وفي الإصدارات الأقدم يمكن البديل بتوليد بادئة + عدّاد تصاعدي ذاتيًا.
🏷️ القوالب والمساعدات ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س لماذا لا تُستخدم Math.random()؟
ج القيم العشوائية تختلف بين SSR والعميل مما يُحدث عدم تطابق في الترطيب (hydration)؛ بينما تضمن useId تطابق الطرفين.
س هل يتغيّر المعرّف مع إعادة العرض؟
ج لا، فهو مستقر داخل النسخة نفسها.
س هل يمكن تخصيص البادئة؟
ج لا تتضمن الدالة بذاتها خيار بادئة؛ وإذا احتجت صيغة معينة فارفقها بنفسك.