javascript Axios响应数据为空,但组件呈现了响应数据?

slmsl1lt  于 2023-03-11  发布在  Java
关注(0)|答案(1)|浏览(147)
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)
我想要的是正确地得到响应数据,而不仅仅是一个空数组...

eqoofvh9

eqoofvh91#

(我不知道确切的时间,但是)有时候,当你记录一个承诺,控制台日志会在承诺被解析后立即更新。日志记录可能与此相关(也许日志记录完成并且长度为0,但是当承诺被解析时,数组引用会被更新,但是长度不会被更新,因为它是通过值传递的)。
使用async/await和.then()链接看起来很奇怪,我认为你应该坚持使用其中一个。也许那部分导致初始渲染变得有点奇怪。

相关问题