сделать что-то, когда вызов ajax успешен в axios - цепочка then () в axios

Question

Я пытаюсь что-то сделать, когда вызов ajax успешен в axios

    save() {

      this.isUpdateTask ? this.updateProduct() : this.storeProduct()

      this.endTask()

    }

, если вызов ajax для обновления или сохранения продукта выполнен успешно, я хочу запустить функцию endTask ().

Я не хочу, чтобы функция endTask () запускалась, когда вызов ajax не был успешным.

как я могу это сделать?

функция хранения:

    storeProduct() {
      return axios
        .post("products", this.getFormData())
        .then(
          response => this.products.push(response.data.data)
        )
        .catch(
          error => (this.serverErrors = error.response.data.errors.detail)
        )
    },

Answer 1

Вы можете вызывать эти методы в новом обещании, как показано в следующем примере:

   save() {
      Promise.resolve()
      .then(() => {
        return this.isUpdateTask ? this.updateProduct() : this.storeProduct()
      })
      .then(() => {
        this.endTask()
      })
    }

Есть и другие способы сделать это:

save() {
  (this.isUpdateTask ? this.updateProduct() : this.storeProduct()).then(() => {
    this.endTask()
  })
}

Или присвоить переменной:

save() {
  const promiseUpdate = this.isUpdateTask ? this.updateProduct() : this.storeProduct()

  promiseUpdate.then(() => {
    this.endTask()
  })
}

Или с помощью async / await:

async save() {
  await this.isUpdateTask ? this.updateProduct() : this.storeProduct()
  // this code runs only if everything happen successful
  await this.endTask()
}

---

И выполнение endTask выполняется до тех пор, пока ответ не будет успешным, потому что вы обрабатываете error внутри storProduct..

.catch(
  error => (this.serverErrors = error.response.data.errors.detail)
)

Итак, в этом случае необходимо повторно выдать ошибку еще раз:

.catch(
  error => {
    this.serverErrors = error.response.data.errors.detail
    throw error
  }
)

catch Promise, имеют тот же эффект try/catch из javascript.

Более подробная информация о catch об обещании здесь .

Answer 2

Попробуйте это: -

storeProduct() {
  return axios
    .post("products", this.getFormData())
    .then(
      response => this.products.push(response.data.data)
      this.endTask();  //call endtask() here after successfull api call and response back from api
    )
    .catch(
      error => (this.serverErrors = error.response.data.errors.detail)
    )
}

Answer 3

Все, что находится внутри .then, выполняется только при получении успешного ответа

.then(response => {
    this.products.push(response.data.data)
    this.save()
    })