Question

我想从 API 服务器获取数据。

const [datas, setDatas]=useState({
        datas: []
});

useEffect(()=> {
        apiClient.post(url) // apiClient is axios.create function
        .then((response)=>
            setData(datas: response.data.response))
},[])

但 console.log(data) 返回 undefined。但是，如果修复部分代码或做其他事情，它会得到正确的值。

所以我删除了useEffect的deps。然后我陷入了 API 调用循环。我找到的解决方案之一是将 useState 的初始值放入一个空数组中。但是，即使将它放入一个空数组中，该值也会返回为 undefined 。
调用服务器没有问题。 console.log(response) 返回有效的响应值。
如果您能告诉我解决方案，我将不胜感激。

Answer 1

试试这个方法

useEffect(()=> {
        apiClient.post(url) // apiClient is axios.create function
        .then((response)=>
            setStations({datas: response.data.response})
},[])

Answer 2

你应该使用你命名的 setDatas：

    useEffect(()=> {
        apiClient.post(url) // apiClient is axios.create function
        .then((response)=>
            setDatas({datas: response.data.response)})
},[])

Answer 3

您对 useState 的使用并不完全正确。如果您只想要一个数组，请使用 const [datas, setDatas] = useState([])。不需要额外的继承。结果是：

useEffect(()=> {
        apiClient.post(url) // apiClient is axios.create function
        .then((response)=>
            setData(response.data.response)
},[])

假设 response.data.response 是所需的数组。

如果你坚持继承(useState({datas: []})，那么你在设置的时候也需要包装一下：...setData({datas: response.data.response})。

axios 调用数据返回 useState undefined

3 个答案: