Проверка состояния Vue и Vuex

Question

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

У меня есть компонент, который загружает набор данных с удаленногообслуживание через axios.Он работает правильно и вызывается при создании компонента.

export default {
  created() {
    this.$store.dispatch('foo/getBar');
  }
  ...
}

Это корректно заполняет переменную "bar" в компоненте значением valeus, возвращаемым из вызова API.

Когда я следующийПри просмотре компонента в приложении созданная функция вызывается снова и снова вызывается API, который возвращает те же данные.

Каков наилучший способ избежать последующих вызовов, пока мы не узнаем, что существуют разные данные длябыть собранным?Или, точнее, как сделать недействительными данные в хранилище, когда это необходимо, чтобы вызов API выполнялся только тогда, когда это необходимо?

Answer 1

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

Или вы можете проверить, является ли переменная bar пустой, а затем выполнить вызов API.