如何在VueJS Mixin中返回值

时间:2016-09-10 14:56:02

标签: javascript vue.js vue-resource vue-component

我目前正在Vuejs开发一个webapp。我创建了一个我可以全局访问的Mixin,它处理对我的api的任何请求:

export default {

  data() {
    return {
      apiURL: 'http://example.com/api',
      timeout: 10000,
    };
  },

  methods: {

    callAPI(method, url, body) {
      this.$http({
        url: this.apiURL + url,
        method,
        body,
        timeout: this.timeout,
      })
      .then((response) =>
        response,
      (response) => {
        if (response.data.error) {
            this.error = response.data.error;
        } else {
          this.error = 'We can\'t connect to the server. Please try again in a few minutes.';
        }
        return response;
      });
      // return 'test';
    },

  },

};

现在,在我的一些组件中,我调用了api函数:

const api_response = this.callAPI('POST', '/auth', credentials);
alert (api_response);

它工作正常,但有一件事不能按预期工作。我希望我的api_response常量的值为response,但始终为undefined。因此,每当我收到undefined的警报时。怎么可能?当我取消注释它的return 'test'行时:我收到了test的提醒,但它似乎无法在this.$http部分内工作...

1 个答案:

答案 0 :(得分:1)

您的callAPI没有return声明,因此返回undefined。如果它返回了您的$http来电,它仍然不会给您response,但会a Promise,所以您可能希望执行类似

的操作
let api_response;
this.callAPI('POST', '/auth', credentials).then((response) => api_response = response);