const categoryLoadList = async ({
category,
}: CategoryLoadListRequestType): Promise<CategoryType[]> =>
await axios
.get<CategoryType[]>(
`${process.env.REACT_APP_BASE_URL}/category${
category !== "" ? "/search" : ""
}`,
{
params: {
category: category !== "" ? category : undefined,
},
}
)
.then((response) => {
console.log(response.data);
return response.data;
});
function useCategory(id: string = "") {
return useQuery("categoryQuery", () => categoryLoadList({ category: id }), {
cacheTime: 20000, //86400000,
staleTime: 20000, //3600000,
refetchOnWindowFocus: false,
retry: 0,
});
}
记录响应数据时,打印“(3)[{...},{...},{...}]”,长度为0... https://media.discordapp.net/attachments/921423896270491668/1083620608585252914/console.log.png
但问题是,使用此响应数据的项目列表组件中包含项目!
1.我用的是Asnyc / Await。
1.它只发生在第一次渲染时。
1.此处未使用函数中的类别参数。(category =“”)
1.在Network选项卡(DevTools)中,我看到响应数据不为空。2(我也尝试了Postman,响应数据也不为空。3)
我想要的是正确地得到响应数据,而不仅仅是一个空数组...
1条答案
按热度按时间eqoofvh91#
(我不知道确切的时间,但是)有时候,当你记录一个承诺,控制台日志会在承诺被解析后立即更新。日志记录可能与此相关(也许日志记录完成并且长度为0,但是当承诺被解析时,数组引用会被更新,但是长度不会被更新,因为它是通过值传递的)。
使用async/await和
.then()
链接看起来很奇怪,我认为你应该坚持使用其中一个。也许那部分导致初始渲染变得有点奇怪。