Vue js modal: mixin или плагин?

Question

У меня есть два разных типа модалов: большие модалы (800x500) и небольшие модалы (300x200).

Из разных компонентов на моем веб-сайте я хочу открыть эти модальности, все с различным содержанием внутри. И даже некоторые из модалов должны открывать другие модели, а также. Я в настоящее время думать об этом приложении структуры:

modals/ 
|- largeModals/ 
| |- profile.vue 
| |- messages.vue 
|- smallModals/ 
| |- enter.vue 
| |- disable.vue 
| |- confirm.vue 
|- largeModal.vue 
|- smallModal.vue 

largeModal.vue и smallModal.vue являются основными компонентами компоновки, файлы в папках содержимое модальностей.

Что было бы лучшим способом открыть новый модальный из других компонентов? Очень важно, чтобы параметр мог быть передан. Так, например, profile modal должен получить user_id для запроса базы данных до отображения профиля пользователя.

This project, например, использует метод Mixin для отображения модальных данных, но некоторые другие предлагают использовать Plugin, поэтому проблем с перезаписью меньше.

Что было бы лучшим способом открыть модальный из любого компонента или из другого модального, например $this.openModal('profile', userId)? И почему? Я использую Vue.js 2.

Answer 1

Самый простой способ будет создать глобальную шину событий

//Example 
Vue.EVENTS = new Vue() 

Насколько глобальна, все события, которые выбрасываются через EVENTS можно слушать в любом месте дерево компонентов.

Например, проверьте, как работает этот плагин: https://github.com/euvl/vue-js-modal/