Vuex action не дожидается окончания обещания sh ax ios - PullRequest
0 голосов
/ 30 января 2020

Я сталкиваюсь со странной ситуацией при разработке приложения в стеке Laravel + VueJS / Vuex.

Я понимаю, что если обещание не возвращается, родительская функция, вызывающая его, не будет ждать его разрешения, поэтому будет go асинхронным. Ax ios возвращает обещание по умолчанию при вызове ресурса через http.

Итак, у меня есть родительская функция, которая выглядит следующим образом:

fetchInvoiceSeries() {
  var arr = []
  let invsrs = this.$store.getters['getInvoiceSeries']
  if (invsrs == null) {
    return this.$store
      .dispatch('get_invoice_series')
      .then(() => {
        invsrs = this.$store.getters['getInvoiceSeries']
        if (invsrs != null) {
          invsrs.forEach(function(s) {
            arr.push({
              value: s.id,
              text: s.series + ' / ' + s.increment
            })
          })
          this.series = arr
        } else {
          console.log('Error while fetching invoice series!')
        }
      })
      .catch(e => {
        console.log(e)
      })
  } else {
    invsrs.forEach(function(s) {
      arr.push({
        value: s.id,
        text: s.series + ' / ' + s.increment
      })
    })
    this.series = arr
  }
}

А вот функция, определенная в действии часть модуля vuex:

get_invoice_series({ commit }) {
    return get('/api/series/0')
        .then(response => {
            if (response.data && typeof response.data !== undefined) {
                let payload = response.data
                commit('SET_INVOICE_SERIES', payload)
            } else {
                console.log('error', error)
            }
        })
        .catch(error => {
            console.log('error', error)
        })
},

Итак, как вы можете видеть, я возвращаю запрос get от ax ios внутри действия. В родителе я вызываю действие и ключевое слово then, чтобы выполнить некоторую обработку после выполненного действия. Также я использую функцию стрелки, потому что мне нужен контекст в родительской функции для вызова этого. $ Store ...

Проблема в том, что даже после проверки получателя, чтобы увидеть, если у штата есть серия счетов и получение их с помощью действия get_invoice_series. У меня до сих пор нет серии счетов в памяти, судя по коду, который я написал. Консоль сохраняет логин ' Ошибка при получении серии счетов! ' при первом выполнении кода и во второй раз (после того, как информация существует в состоянии), код пропускает выборку счета серия (как и ожидалось) .

Можете ли вы сказать мне, что я делаю не так? Спасибо!

1 Ответ

1 голос
/ 30 января 2020

Ваша ошибка возникает из-за того, что invsrs является нулевым в первый раз, а не нулевым во второй раз.

Это означает, что ваша функция get_invoice_series({ commit }) является асинхронной и возвращает обещание.

Для большей читабельности, возможно, вам следует сделать свой вызов независимо от вашего оператора return, используя выражения async/await:

async get_invoice_series({ commit }) {
    const response = await get('/api/series/0')
    if (response.data === undefined) return null    
    const payload = response.data
    commit('SET_INVOICE_SERIES', payload)
    return payload
},

, а затем заставьте ваши вызовы ждать обработки этого извлечения :

async fetchInvoiceSeries() {
  let arr = []
  const invsrs = await this.$store.getters['getInvoiceSeries']
  // ...

Здесь чисто догадки, дайте мне знать, помогает это или нет.

...