通过JavaScript对象传递axios响应[重复]答案

【问题标题】：Passing axios response through JavaScript object [duplicate]通过JavaScript对象传递axios响应[重复]
【发布时间】：2020-07-20 15:15:12
【问题描述】：

我有一个代表我的搜索功能的类。它有一个名为“executeSearch”的类，它根据您可以在数据库中搜索的属性信息接收参数：

const axios = require('axios').default

class Search {
    executeSearch (addressLine1, City, Country, Postcode, AskingPrice) {
        axios.get('http://localhost:5000/property/findAny/' + addressLine1 + '/' + City + '/' + Country + '/' + Postcode + '/' + AskingPrice + '/')
            .then(res => {
                console.log(res)
                return res
            })
            .catch(err => {
                return err
            })
    }
}

module.exports = Search

在 Vue 组件中，我有以下代码：

import Search from '../js/search'

const search = new Search()

export default {
  name: 'Home',
  data() {
    return {
      searchResult: Object
    }
  },
  mounted(){
    this.searchResult = search.executeSearch('test43167', ' ', ' ', ' ', ' ')
    console.log(search.executeSearch('test43167', ' ', ' ', ' ', ' '))
  }
}

vue组件里面的控制台日志好像总是输出undefined，但是axios函数里面的控制台日志有预期的数据。

我做错了什么？

【问题讨论】：

标签： javascript node.js vue.js axios

【解决方案1】：

通常我会说，您应该使用return Promise.resolve(res)（这是正确的）而不是使用return res，但鉴于您在返回响应之前什么都不做，只需返回axios 请求：

class Search {
    executeSearch (addressLine1, City, Country, Postcode, AskingPrice) {
        return axios.get('http://localhost:5000/property/findAny/' + addressLine1 + '/' + City + '/' + Country + '/' + Postcode + '/' + AskingPrice + '/')    
    }
}

那么当你消费这个API请求的时候，你就可以在.then内应用searchResult到res

mounted(){
    search.executeSearch('test43167', ' ', ' ', ' ', ' ')
        .then(res => {
            this.searchResult = res
        })
        .catch (err => {
            // handle a failed request
        })
}

【讨论】：