Javascript 在axios拦截器中处理承诺拒绝

在处理一个具体的错误案例时遇到困难，似乎我对承诺的理解是有缺陷的。 axios interceptor中的中央错误处理，处理我对api的所有调用和大部分错误，如下所示：

export function apiFactory(vue, $security) {
  const $http = axios.create({
    baseURL: process.env.API_URL
  });

  $http.interceptors.request.use(function (config) {
    const token = $security.loginFrame.getToken();

    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }

    return config;

  }, function (err) {
    vue.$eventBus.$emit('toastMessageHandler', {message: error.message, type: 'error'});
    return Promise.reject(err);
  });

  $http.interceptors.response.use(function (response) {

    return response;

  }, function (error) {
    if (error.response && error.response.status === 401) {
      vue.$eventBus.$emit('authErr', error);
    } else if (error.response && error.response.status === 403) {
      alert('you are not authorized, please contact EM support');
    }
    else if (error.response && error.response.status !== 409){
      vue.$eventBus.$emit('toastMessageHandler', {message: error.message, type: 'error'});
    }

    return Promise.reject(error);
  });

 async addTag() {  //needs better error handling, make sure loader changes in cases of fail.
        if (this.newTag.length > 0) {
          this.loading = true
          this.$emit('loading', true)
          const payload = {
            term: this.newTag,
            term_type: this.type,
            partner_code: this.query.partner_code,
            language: this.query.language
          }
          try {
            await this.apiFacade.createSearchTerm(payload); //this is the call directly above, it just goes through a facade.
            this.$emit('loading', false)
            this.loading = false
            this.tags.unshift(this.newTag)
            this.newTag = ''
            this.$eventBus.$emit('toastMessageHandler', {
              message: this.$t(`search_terms.add_success`),
              type: 'info'
            });
          } catch (e) { //error is undefined
            if (e.response.status === 409) {
              this.$eventBus.$emit('toastMessageHandler', {
                message: this.$t(`search_terms.duplicate_term`),
                type: 'error'
              });
            }
          }
        }
      },

这在大多数情况下都很有效，但在一种情况下，我调用了以下api：

async createSearchTerm(term) {
      return await this.$http({
        url: `/v1/searchTerms/term`,
        method: 'POST',
        data: JSON.stringify(term)
      })
  }

我试图捕获的

409

错误没有到达组件，组件中的代码如下所示：

export function apiFactory(vue, $security) {
  const $http = axios.create({
    baseURL: process.env.API_URL
  });

  $http.interceptors.request.use(function (config) {
    const token = $security.loginFrame.getToken();

    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }

    return config;

  }, function (err) {
    vue.$eventBus.$emit('toastMessageHandler', {message: error.message, type: 'error'});
    return Promise.reject(err);
  });

  $http.interceptors.response.use(function (response) {

    return response;

  }, function (error) {
    if (error.response && error.response.status === 401) {
      vue.$eventBus.$emit('authErr', error);
    } else if (error.response && error.response.status === 403) {
      alert('you are not authorized, please contact EM support');
    }
    else if (error.response && error.response.status !== 409){
      vue.$eventBus.$emit('toastMessageHandler', {message: error.message, type: 'error'});
    }

    return Promise.reject(error);
  });

 async addTag() {  //needs better error handling, make sure loader changes in cases of fail.
        if (this.newTag.length > 0) {
          this.loading = true
          this.$emit('loading', true)
          const payload = {
            term: this.newTag,
            term_type: this.type,
            partner_code: this.query.partner_code,
            language: this.query.language
          }
          try {
            await this.apiFacade.createSearchTerm(payload); //this is the call directly above, it just goes through a facade.
            this.$emit('loading', false)
            this.loading = false
            this.tags.unshift(this.newTag)
            this.newTag = ''
            this.$eventBus.$emit('toastMessageHandler', {
              message: this.$t(`search_terms.add_success`),
              type: 'info'
            });
          } catch (e) { //error is undefined
            if (e.response.status === 409) {
              this.$eventBus.$emit('toastMessageHandler', {
                message: this.$t(`search_terms.duplicate_term`),
                type: 'error'
              });
            }
          }
        }
      },

似乎我的拦截器返回的是一个承诺，而不是一个对象，因此我无法处理它。理想情况下，我不需要在组件中解析承诺，而只需要接收错误消息。建议采用什么方法将实际错误传递给我的组件，以便我能够正确处理它

预期-将

错误

对象传递到调用失败的位置。 实际-

错误

未定义

编辑当我在拦截器代码中的两个位置更改代码时，我能够看到错误并处理它：

返回承诺。拒绝（{error}）
然后在组件中：
catch（{error}）{//error未定义
如果（error.response.status==409）
我真的不明白为什么会这样？可能是因为解构强制承诺解决问题？
我有一些非常类似的设置，它工作正常，我知道这没有帮助，但当我调试它时，它说
e
也是
未定义的
，但实际上不是，你能
控制台吗。注销
看看是否它实际上是
未定义的
。也不是
e.response.status
而不是你的catch中的
status
。我尝试了你的建议，但不幸的是没有成功。我确实将它添加到了代码中，因为它是正确的。你看到网络选项卡中的请求/响应了吗？对所有问题表示歉意，你的代码似乎很好，所以它可能会发生ning别处。是的，我在网络选项卡中得到了一个409，它肯定没有到达组件中的错误处理程序。在拦截器中尝试
抛出错误；
而不是
返回承诺。拒绝（错误）；
。