أفكر في عمل login modal في component مستقل بذاته ويتم استدعاؤه من الnavbar بالصفحة الرئيسية…
قرأت عن خاصية $emit لكن لم أنجح في تطبيقها أبدا…
الطريقة التي أفكر بها هي ربط @click="" في الnavbar بــ event يستطيع اطلاق الmodal
كيف ستكون الطريقة المثالية لذلك؟ وماهي الأساليب الأخرى التي يمكن تطبيقها؟
هذه الخاصية تتيح لك ان تعمل حدث event من خلاله تقوم بارسال ما تريد لل root الاساسي.
كما في حال الحدث click لكن الحدث click اساسي
اما انت تستطيع انشا الحدث الذي تريد من خلال emit
الطريقة صحيحة لكن التنفيذ يحتاج لربط الافكار فيما بعضها. لذا يجب معرفة بعض الأمور قبل أن نتطرق إلى الحل.
أولاً نحتاج اظهار الكومبوننت نتيجة لقيمة متغير ما. بوضع الdirective:
v-if في الكومبوننت الخاص بالمودال. مثل التالي:
<modal v-if="isOpen" />
ثانياً في الزر الموجود في النافبار والذي يختص بإظهار المودال. يتم وضع @click مثلما قلت بالدالة أو حتى مجرد عبارة تقوم بوضع علامة true كقيمة للمتغير والتي من خلالها ستمكننا من اظهار الكومبوننت
<button @click="isOpen = true"></button>
وأخيراً نأتي للجزء الذي يتعلق ب $emit وهي التي تمكننا من انشاء حدث خاص أو ارسال قيمة ما من الكومبوننت الإبن إلى الكومبوننت الأب, من خلالها يستطيع الكومبوننت الأب (كومبوننت النافبار مثلاً) معرفة اذا قام المستخدم بالضغط على الزر اغلاق أو لا.
closedModal() {
this.$emit('closed');
}
في حال تم اغلاق المودال. نقوم بوضع قيمة false للمتغير الذي يقوم بإظهار المودال (في الكومبوننت الأب):
<modal closed="isOpen = false"/>
لاحظ closed وهو الحدث الذي أنشأناه في الكومبوننت الإبن.
هناك أيضاً حلول جاهزة للتعامل مع ال modals مثل هذه المكتبة https://github.com/euvl/vue-js-modal#readme
أو بما انك تستعمل في بوتستراب توجد مكتبة للبوتستراب خاصة بإطار العمل Vue
https://bootstrap-vue.js.org/docs/components/modal/
نعم بالضبط
أحسنت @Ayman97
نعم يمكنني استخدام حلول جاهزة لكن الأفضل أن أجرب الطريقة بنفسي حتى أفهم اللغة بشكل أحسن 
سأقوم بالتنفيذ بحسب الترتيب المذكور
شكرا …
بالتوفيق أخي 