Имеется проект со след структурой
app/page.tsx
import ECommerce from "@/components/Dashboard/E-commerce";
import { Metadata } from "next";
import DefaultLayout from "@/components/Layouts/DefaultLayout";
import { getSession } from "@/utils";
import { redirect } from "next/navigation";
import { cookies } from "next/headers";
export const metadata: Metadata = {
title:
"Next.js E-commerce Dashboard | TailAdmin - Next.js Dashboard Template",
description: "This is Next.js Home for TailAdmin Dashboard Template",
};
export default async function Home() {
const cookieStore = cookies();
const session = cookieStore.get("user_guid");
if (!session) {
redirect("/auth/signin");
}
return (
<>
<ECommerce />
</>
);
}
"use client";
import dynamic from "next/dynamic";
import React, { useEffect, useState } from "react";
import { getAllProducts } from "@/service/product";
const ECommerce: React.FC = () => {
console.log("ECommerce");
// const [page, setPage] = useState("1");
// const getProducts = async (page: string) => {
// await getAllProducts(page);
// };
//
// useEffect(() => {
// getProducts(page);
// }, [page]);
return (
<>
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6 xl:grid-cols-4 2xl:gap-7.5"></div>
<div className="mt-4 grid grid-cols-12 gap-4 md:mt-6 md:gap-6 2xl:mt-7.5 2xl:gap-7.5">
<div className="col-span-12 xl:col-span-8"></div>
</div>
</>
);
};
export default ECommerce;
Почему E-commerce перерисовывает два раза: если там делать запрос в юзэффекте (то что закомментено), то он два раза вызывается