Question 327325 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Nextjs, Help me solve a URL issue

I just started learning NextJS 13 App route, I’m a bit confused about URLs.

enter image description here

structure folder:

app
    products
            [slug]
                    page.tsx
components
    ProductCard.tsx

example:

// ProductCard.tsx

return (
    <div>
        <Link href={`/products/${prod.slug}`} />
    </div>
)

when click to Link then url is 'localhost:3000/products/car'

i want url is 'localhost:3000/car'

help me!
Tags:

2

Answers


  1. 0

    As per looking at your question, you want your url to be

    i want url is ‘localhost:3000/car’

    And this is happening

    when click to Link then url is ‘localhost:3000/products/car’

    So as per what you need is
    href={/${prod.slug}}

    So you will get the url like

    https://localhost:3000/whatever the sug contains

    Login or Signup to reply.
  2. 0

    Edit the srtucture so you don’t get 404:

    app
    [slug]
        page.tsx

components
    ProductCard.tsx

    and edit your ProductCard.tsx:

    // ProductCard.tsx

return (
    <div>
        <Link href={`/${prod.slug}`} />
    </div>
)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search