0

I'm creating an app using the App Router pattern in Nextjs.

I have a folder structure that looks like this:

folder-structure

From inside the level-1 page, I would like to link to level-1/level-2.

Obviously I can do this by hardcoding href to level-1/level-2. However, is there a way to compute the level-1 value dynamically, so I could do something like this:

<Link href="/level-2">
    This should automatically link to /level-1/level-2
</Link>

I could use usePathname - but this would work only on the client side.

Is there a way to accomplish this based only on the code structure somehow ?

sarincasm
  • 477
  • 3
  • 9
  • do u want to do it in server component? – Yilmaz May 15 '23 at 00:22
  • @Yilmaz yes, i want to do it in a server component. – sarincasm May 15 '23 at 00:25
  • Can u use the Link component on the server component? – Yilmaz May 15 '23 at 00:26
  • @Yilmaz Yes you can, Here's the documentation [When to use server component and client component](https://nextjs.org/docs/getting-started/react-essentials#when-to-use-server-and-client-components) – Re9iNee May 15 '23 at 01:41
  • @sarincasm, I've looked it up, this is not a behavior Next expects (relative pathnames - like react-router-dom)... Why don't you use dynamic routing instead? Your project directory will look like: ```Levels/[level].tsx``` – Re9iNee May 15 '23 at 01:42

0 Answers0