Использование Vuex, а также Event Bus в Vue - PullRequest
0 голосов
/ 06 июля 2018

Этот вопрос у меня уже давно спрятан в моем умственном Rolodex. Я запускаю очень сложное приложение Vue, которое имеет дело с большим количеством компонентов, которые должны взаимодействовать, поэтому для этого я использую очень структурированную настройку Vuex с использованием ее module системы. Однако для конкретной группы компонентов, скажем, папка comments, т.е.:

Комментарии Каталог:

  • Comments.vue // общий компонент комментариев
  • Comment.vue // компонент для каждого комментария
  • NewComment.vue // компонент для создания новых комментариев
  • bus.js // зарезервированная шина событий только для этих трех компонентов

Можно ли использовать зарезервированный Event Bus, размещенный в этом каталоге, только для того, чтобы эти 3 компонента могли взаимодействовать друг с другом, или это считается "халатностью", поскольку у меня уже работает большая система vuex?

Ответы [ 2 ]

0 голосов
/ 06 июля 2018

Я предлагаю использовать Vuex для всех ваших приложений. При этом ваше состояние сохраняется в одноместном месте. Использование шины событий отвлекает от этого, так как теперь у вас есть два места, содержащие состояние. Хуже того, шина событий менее удобна в обслуживании и часто нарушает «односторонний поток данных», поддерживаемый Vue и Vuex (и другими реализациями Flux).

Vuex может использоваться как для состояния приложения , так и для данных приложения . Данные - это обычные вещи, такие как данные клиента и т. Д. Укажите, что «это меню гамбургера на боковой панели открыто» или «этот модал открыт» или «пользователь выбрал этот элемент в списке».

Это приводит к тому, что «я просто чувствую, что Vuex следует использовать для связи всего приложения, а не для связи между 2-3 соседними компонентами». Это то же самое, когда вы думаете об этом.

Если родительский компонент хочет связаться с дочерним компонентом, он пропускает подпорки. Если ребенок хочет общаться 1013 * развязанным образом, он генерирует события. Это прекрасно для этого сценария.

Попробуйте сделать это с несколькими вложенными компонентами! A -> B -> C -> D

Представьте себе, если D нужно обновить какое-то состояние в B. Как вы это делаете, полностью генерируете события и соединяете ваши компоненты? Тьфу, это не тот путь. D должен отправить действие Vuex, которое, в свою очередь, обновляет B через привязку магазина. Как насчет того, когда A нужно обновить что-то в C? Теперь вашему компоненту B требуются дополнительные подпорки в специальном случае, чтобы позволить A общаться с C, когда B сможет существовать сам по себе без A в качестве родителя. Тьфу опять! Отправьте действие.

Связь между одноуровневыми компонентами или даже компонентами в совершенно разных частях страницы - это точно одна из вещей, для которых Vuex предназначена: состояние приложения.

Удаление вашей шины событий и принятие этого подхода сделает ваш код проще и удобнее в обслуживании.

0 голосов
/ 06 июля 2018

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

...