Запустить метод на компоненте с помощью Vuex

Question

У меня есть компонент Vue, который содержит карту Leaflet . В настоящее время я использую шаблон шины событий для запуска некоторых методов Leaflet, когда другие компоненты запрашивают это:

// in Map.vue
eventBus.$on('invalidateMapSize', () => {
  this.map.invalidateSize(true)
})

eventBus.$on('setMapView', (coordinates, zoom) => {
  this.map.setView(coordinates, zoom)
})

// in other components
eventBus.$emit('setMapView', [47.6623, 23.6970], 15)

Теперь я хочу перевести мое приложение на Vuex, и мой вопрос заключается в том, как добиться такой же функциональности?

Answer 1

Хотя это правда, что существует тенденция использования VueX и отклонения от шаблона шины событий, я лично считаю, что оба шаблона дополняют друг друга.

Состояния VueX хорошо соответствуют данным / реквизитам компонента Vue иих производные (вычисленные, часы).

Но есть случаи, когда вы не управляете состоянием, а действительно каким-то событием: щелчок пользователя, который должен вызвать одноразовое действие (и вам не нужно записывать такоеизменение, поэтому состояние бесполезно / излишне для этой цели);сетевой ответ, который содержит временные данные (например, результат поиска);и т. д.

В этих случаях я все еще использую шину событий, поскольку эквивалентная функция была преднамеренно удалена из VueX.

В вашей ситуации мне кажется, что она хорошо вписывается впоследний случай: листовка (не только) отображает статические данные, полученные из некоторых состояний (это может быть в случае маркеров, слоев плитки ...), но обеспечивает интерактивность пользователя, когда ваше приложение может создавать помехи, время от времени заставляя просмотрдля некоторых событий.

Попытка достичь этой функциональности с использованием состояний очень вероятно потребует записи последнего запрошенного вида карты в состоянии, наблюдения за этим состоянием и запуска побочного эффекта при изменении состояния.Тогда возникает проблема, когда запрашивается переустановить вид в ту же позицию ...