toRefs() تحويل الكائن إلى مجموعة refs

آخر تحديث: 2026-10-22

toRefs() تحويل الكائن إلى مجموعة refs

تحوّل toRefs() كل خاصية من الكائن التفاعلي إلى ref، فتبقى القيم المفكَّكة تفاعلية — وهي الطريقة القياسية لتفكيك حالة reactive.

المجموعةالتفاعلية: الأدوات
النوعAPI
النطاقداخل المكوّن
إصدار Vue3.0+
دعم SSRمدعوم

📝 الصيغة

const state = reactive({ a: 1, b: 2 })
const { a, b } = toRefs(state)   // كلٌّ من a وb هو ref يبقى متزامنًا مع state
a.value++                        // تتزايد state.a أيضًا

⚙️ الوسائط

objectكائن تفاعلي (وكيل reactive)

القيمة المُرجعة:كائن عادي يربط كل اسم خاصية بـ ref

▶ مثال

عدّل الشيفرة أدناه وشاهد النتيجة مباشرة:

المخرجات:

Both numbers move together — the destructured ref stays linked.

💡 نقاط مهمة

💡 نصيحة عند إرجاع حالة تفاعلية من دالة تركيبية استخدم toRefs، فيتمكن المستدعي من التفكيك واستخدامها بأمان.
⚠️ تحذير لا معنى لها إلا مع الكائنات التفاعلية: استدعاؤها على كائن عادي يُنتج مراجع refs منفصلة غير مرتبطة.
ℹ️ ملاحظة يمكن استخدام الكائن المُعاد من toRefs في setup مباشرةً في القالب (لأن القالب يفكّ تلقائيًا).
المزيد من الحالات قريباً.

📚 دروس ذات صلة

❓ الأسئلة الشائعة

س ماذا يحدث لو فكّكت دون toRefs؟
ج تحصل على قيم لقطة من تلك اللحظة، فلن تنعكس تغييرات المصدر لاحقًا ولن تتحدّث الواجهة.
س هل يمكن استخدامها مع ref؟
ج لا تناسبها: فـ ref وحدة تفاعلية بذاتها؛ استخدمها مباشرة أو استخرج قيمتها بـ unref.
س هل تُكتب التعديلات بعد التفكيك مرة أخرى إلى الكائن المصدر؟
ج نعم، لأنها قناة ثنائية الاتجاه إلى نفس الخاصية.
Web-Tutorial.com

فريق Web-Tutorial التقني

منصة دروس برمجية يديرها عدة مطورين. كل درس يتم كتابته ومراجعته بواسطة مطورين متخصصين في المجال. نعمل على ضمان دقة وموثوقية المحتوى — إذا لاحظت أي مشكلة، فيرجى إخبارنا.

100%