useEffect does not work when there is a server component inside the component
Answered
Mathissou posted this in #help-forum
Hi, I have a page.tsx, with useEffect to launch a data fetch. And inside this page, i also have a server side navbar. but since the navbar has been server sided, my useEffect stopped working. Can you please help me ?
Answered by Jumbo flying squid
In Next.js, when you mix server and client components, you need to ensure that client-side functionality (like useEffect) is properly isolated and rendered on the client side.
4 Replies
Jumbo flying squid
Ok. Please DM me.
Jumbo flying squid
In Next.js, when you mix server and client components, you need to ensure that client-side functionality (like useEffect) is properly isolated and rendered on the client side.
Answer
Have you solved this?
Easy fix is to move the Client Components that needs to use
Easy fix is to move the Client Components that needs to use
useEffect to a different file marked with “use client” at the top, and then import it into your Server Component.@LuisLl Have you solved this?
Easy fix is to move the Client Components that needs to use `useEffect` to a different file marked with “use client” at the top, and then import it into your Server Component.
Yeah, i solved it by isolating the component into a new 'use client' file, thanks !