axios 使用useEffect钩子React对后端进行无休止的请求

nle07wnf 于 2022-11-05 发布在 iOS

关注(0)|答案(2)|浏览(203)

我正在尝试向后端发出请求，以便在组件加载时，它可以接收一些要呈现的数据。
问题是应用程序进入了消耗资源的请求的无限循环。
我做错了什么？

useEffect(() => {
    Axios.post("http://localhost:3005/people", {UUID}).then((response) => {
        const peopleArray = [];
        for (let key in response.data) {
          peopleArray.push({ ...response.data[key] });
        }
        setPeople(peopleArray);
      });
  });

axios

来源：https://stackoverflow.com/questions/72886023/endless-request-to-back-end-using-useeffect-hook-react

2条答案

按热度按时间

mefy6pfw1#

您需要一个依赖项数组来useEffect，以便仅在已安装的组件上运行或这些依赖项中的任何一个发生更改。由于没有依赖项数组，因此它将在每次渲染时运行，这将导致无限循环。

useEffect(() => {
    Axios.post("http://localhost:3005/people", {UUID}).then((response) => {
        const peopleArray = [];
        for (let key in response.data) {
          peopleArray.push({ ...response.data[key] });
        }
        setPeople(peopleArray);
      });
  }, []);

赞(0）回复(0）举报 2022-11-05

o8x7eapl2#

检查Documentation或检查此示例w3school
仅在初始渲染上运行效果：

useEffect(() => {
 Axios.post("http://localhost:3005/people", {UUID}).then((response) => {
    const peopleArray = [];
    for (let key in response.data) {
      peopleArray.push({ ...response.data[key] });
    }
    setPeople(peopleArray);
 });
}, []); // <- add empty brackets here

赞(0）回复(0）举报 2022-11-05

我来回答

axios 使用useEffect钩子React对后端进行无休止的请求

2条答案

相关问题

热门标签

最新问答