为什么要用vuex的嵌套承诺呢？

Question

我正在维护我以前的程序员的vue代码。

我在他的vuex模块中找到了这段代码。

import axios from "axios";
import qs from "qs";
import httpi from "../httpInstance";  // this is just a wrapper for axios

const getPromise = (context, url) => {
  return new Promise((resolve, reject) => {
    httpi.get(url).then(
      (response) => {
        resolve(response);
      },
      (error) => {
        reject(error);
      }
    );
  });
};

// same repeated for 'put', 'post' etc...

我想知道他为什么这样嵌套承诺。

在ACTIONS中，他使用这个包装器调用后端API，如下所示。

const actions = {
  [ACT_GET_ALL_RULESOURCE]: function (context) {
    return getPromise(context, `${APIURLPREFIX}/polapi/api/rulesource`);
  },

他通过这件事想达到什么目的？

我很困惑，因为axios(httpi)本身已经是一个承诺。这里有什么意义？

**编辑

在Vue Component methods中，他使用如下操作。

getAllRulesource() {
  this.$store.dispatch(`rules/${ACT_GET_ALL_RULESOURCE}`)
    .then((res) => {
      this.rulesourceList = res.data;
    })
    .catch((err) => {
      this.msg = "Cannot GET rulesource";
    })
}

Answer 1

之前的开发人员没有很好地理解承诺。由于httpi似乎返回了一个承诺( OP代码调用了它的then )，所以getPromise函数可以并且应该重写为.

const getPromise = (context, url) => {
  return httpi.get(url);
};

或者完全被移除。可能打电话的人可以说.

httpi.get('http...').then(response => {
  console.log(response);
}).catch(error => {
  console.log(error);
})

在声明为async的函数中，更现代的调用方语法是.

try {
  const response = await httpi.get('http...');
  console.log(response);
} catch(error) {
  console.log(error);
}