时间戳

首页 > 解决方案 > 从 reactJS 中的 axios 函数获取返回值

reactjs - 从 reactJS 中的 axios 函数获取返回值

问题描述

我是 reactJS 新手，我的问题是我想为我的变量分配一个从 axios 函数返回的值。当我这样做时，我得到了 u1 的未定义值。

 function getUsername(userid){
        var user = ''
        axios.post('/api/getuserdata' , {_id:userid}).then(res=>{
            console.log(res.data)
            const userdata = res.data[0]
            user = userdata.username

        }).catch(err=>{
            console.log(err)
        })

        return user

    }
    const u1 = getUsername(id)

标签： reactjs

解决方案

您的代码不起作用的原因是POST由处理的请求axios是异步的，您的getUsername函数不会等待该请求解决并user在调用后立即返回。最简单的解决方案是让你的getUsername异步并在另一个异步函数中调用它，或者如果你想将POST请求返回的结果用于其他一些东西，你可以将它存储为statein React，这样会更好。你可以使用这样的东西：

const getUsername = async (userid) => {
    try {
        const response = await axios.post("/api/getuserdata", { _id: userid });
        const userdata = response?.data?.[0]?.username || "";
        return userdata;
    } catch (error) {
        console.log(`error`, error);
    }
};

// in another function
const doSomethingWithUsername = async (id) => {
    const username = await getUsername(id);
    // other stuff..
}

推荐阅读