이 약속이 발신자에게 다시 해결되지 않는 이유는 무엇입니까?

이 약속이 발신자에게 다시 해결되지 않는 이유는 무엇입니까?

Vue-App은 Vuex 및 Axios와 함께 실행됩니다.이 앱에는 API 호출을 처리하는 vuex-store가 있지만, 스토어 액션을 호출할 때 호출자의 응답을 체인으로 연결할 수 없다는 것이 문제입니다.내가 뭘 잘못했는지 알아요?

호출 코드:

import { FETCH_PRODUCTS, ADD_PRODUCT } from './actions.type'

methods: {
    sendNewProduct () {
      this.$store
        .dispatch(ADD_PRODUCT, this.newProductForm)
        .then(() => {
          console.log('This never gets called')
        })
    }
  }

Vuex 스토어:

const actions = {
  [ADD_PRODUCT] (context, credentials) {
    return new Promise((resolve) => {
      ApiService
        .post('/Products/', {
          Name: credentials.Name,
          Description: credentials.Description,
          Price: credentials.Price
        })
        .then(({ data }) => {
          this.$store
            .dispatch(FETCH_PRODUCTS)
            resolve(data)
        })
        .catch(({ response }) => {
          console.log(response)
          context.commit(SET_ERROR, 'Error adding product')
        })
    })
  }
}

const actions = {
  [ADD_PRODUCT](context, credentials) {
    return ApiService.post("/Products/", {
      Name: credentials.Name,
      Description: credentials.Description,
      Price: credentials.Price
    })
      .then(({ data }) => {
        this.$store.dispatch(FETCH_PRODUCTS);
        return data;
      })
      .catch(({ response }) => {
        console.log(response);
        context.commit(SET_ERROR, "Error adding product");
        throw new Error("Error adding product");
      });
  }
};

제가 제거했습니다.new Promise(...)왜냐하면 공리는 이미 약속을 만들기 때문입니다.추가된 경우return data에서then콜백과 던지기catch호출 API가 데이터/오류를 수신할 수 있도록 콜백합니다.

FETCH_PRODUCTS가 완료되기 전에 약속이 해결되므로 작업도 완료되도록 다음과 같이 기록합니다.

.then(({ data }) => {
  return this.$store.dispatch(FETCH_PRODUCTS)
    .then(() => data);
})

언급URL : https://stackoverflow.com/questions/52910005/why-is-this-promise-not-resolving-back-to-the-caller