Next.js Discord

Discord Forum

Infinite component refresh when fetching data

Unanswered
Chinese perch posted this in #help-forum
Open in Discord
Chinese perchOP
I have an issue with my next.js 13.4 app. I created a cilent-side parent which passing as a prop current user email. The child is a server-side component which feching data using prop from the parent. The issue is when I start server and enter to url with my component I get infinite refresh and I can't see anything on the page.

5 Replies

@joulev since you imported `Data` to a client component, `Data` implicitly becomes a client component
Chinese perchOP
So how to solve my issue? What I schould do?
@Chinese perch So how to solve my issue? What I schould do?
if you want to use an async component, ensure it is a server component, e.g. with the following
import Data from "./Data"

const Page = async () => {
  // https://next-auth.js.org/configuration/nextjs#in-app-directory
  const session = await getServerSession(...);
  return <Data email={session.data?.user?.email}/>
  )
}
export default Page

if you want to keep using client components, use react-query or swr to fetch data