useEffect not running on navigation between routes in App Router

[notestechme]

Summary

Im migrating an old project to the App Router in Next.js (using the /app directory), and noticed that my useEffect doesnt seem to run again when navigating between routes.

Here’s a simplified version:

"use client";
import { useEffect } from "react";

export default function Page({ params }) {
  useEffect(() => {
    console.log("Page loaded:", params.slug);
  }, []);

  return <div>Slug: {params.slug}</div>;
}

When I go from /post/abc to /post/xyz, the console.log doesn’t show again. It’s like the component is reused or cached.

I expected the effect to run again since the slug param is different. Is this expected behavior in the App Router? Is there a workaround to force re-execution?

Thanks!


### Additional information

```js
Next.js version: 14.1.x
App Router using app/post/[slug]/page.js
No errors, just useEffect not retriggering on route change
Client components in use, no server rendering

Example

No response

[icyJoseph]

Could you share more of what's going on? https://stackblitz.com/edit/nextjs-hhafptji?file=app%2Fpage.tsx,app%2Fposts%2F[slug]%2Fpage.tsx,app%2Flayout.tsx this one works fine, using Next 14

[icyJoseph]

I guess, you can use useParams alternatively for now, https://nextjs.org/docs/14/app/api-reference/functions/use-params, does it even work in your setup?