Происходит бесконечный ререндер компонента react
При загрузке страницы в консоль выводится такая ошибка:
Uncaught Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.
at renderWithHooks (react-dom.development.js:16317:1)
at mountIndeterminateComponent (react-dom.development.js:20074:1)
at beginWork (react-dom.development.js:21587:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at beginWork$1 (react-dom.development.js:27451:1)
at performUnitOfWork (react-dom.development.js:26557:1)
at workLoopSync (react-dom.development.js:26466:1)
at renderRootSync (react-dom.development.js:26434:1)
И ещё одна:
The above error occurred in the component:
at Home (http://localhost:3000/static/js/bundle.js:1216:88)
at RenderedRoute (http://localhost:3000/static/js/bundle.js:51823:5)
at Routes (http://localhost:3000/static/js/bundle.js:52246:5)
at div
at App
at Router (http://localhost:3000/static/js/bundle.js:52184:15)
at BrowserRouter (http://localhost:3000/static/js/bundle.js:50531:5)
at Provider (http://localhost:3000/static/js/bundle.js:47871:5)
Consider adding an error boundary to your tree to customize error handling behavior. Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
Вот проблемный файл Home.tsx:
import Search from "../components/Search";
import { useLazyGetAllPostsQuery } from "../store/blogApi/blog.api";
import {useEffect} from "react";
import { useAppSelector, useActions } from "../store";
import Preloader from "../components/Preloader";
export default function Home() {
const [getAllPosts, {data: postsRes, isLoading}]= useLazyGetAllPostsQuery();
const {searchQuery, allPosts} = useAppSelector(state => state.searchPosts);
const {pushPosts, searchPosts} = useActions();
getAllPosts();
pushPosts(postsRes?.posts ?? []);
return (
<>
{false ? <Preloader />
: <div className="home">
<Search />
</div>
}
</>
);
}
Если закомментировать useLazyGetAllPostsQuery() хук, то всё работает.
Ссылка на репозиторий проекта: https://github.com/Timurka666/blog