从内部

时间:2019-02-04 19:04:32

标签: reactjs jsx

我有一个可以容纳其他对象的对象。

import Axios from "axios";

let API = {
    get:{
        dogPicture: () =>
        {   
            Axios.get("https://dog.ceo/api/breeds/image/random")
            .then(res => {
                //this.setState({wiseDog:res.data.message})
                //this.setState({isLoading:false})

            })
            .catch( err => {
                //this.setState({error:err.data.message})
            })
        },
        dogFact: () =>
        {
            Axios.get("/facts")
            .then( response => {
                //this.setState({DogFact:response.data.facts[0]})
                //this.setState({isLoading:false})
                return response.data.facts[0];
            })
            .catch( err => {
                console.log("still error", err)
                //this.setState({error:err})
                return err;
            })
        },
        test: () => "test"
    }
}  

export default API;

如果我导入并致电

let message = API.get.test();

它将返回字符串测试。 但是,如果我尝试退回dogPicture的资源或dogFact的响应, 它返回undefined。 如果我尝试console.log(res),它将显示正确的期望值。

调用这些函数时,如何返回从res和response获得的值?

1 个答案:

答案 0 :(得分:1)

简单地说,您不能。 Javascript是一种异步语言,并且以同步方式返回“测试”。因为您涉及远程API,所以我建议返回一个Promise(添加异步将使您的函数变成Promise,并允许您使用await):

import Axios from "axios";

let API = {
    get:{
        dogPicture: async () =>
        {   
            const res = await Axios.get("https://dog.ceo/api/breeds/image/random");

            return res.data;
        }
        test: () => "test"
    }
}  

export default API;

然后在您的代码中,您可以使用:

let message = await API.get.dogPicture();