Next.js Catch All Segments | Next.js Beginner Tutorial | Next.js Catch Multiple Segments Tutorial

Sdílet
Vložit
  • čas přidán 11. 06. 2024
  • This Next.js 14 and 15 tutorial shows you can make Dynamic Segments even more flexible by turning them into "catch-all" segments that capture all the remaining parts of the URL path. To do this, simply add three dots ... inside the square brackets - [...segmentName].
    For example, let's say you have a file named pages/shop/[...slug].js. This will match the URL path /shop/clothes, but it will also catch any additional segments that come after /clothes.
    So it will also match URLs like /shop/clothes/tops, /shop/clothes/tops/t-shirts, and so on.
    By using the [...slug] syntax, you're telling Next.js to take all the remaining URL segments after /shop/ and bundle them up into the slug parameter, which you can then access and use inside your React component.
    Next.js 14
    Next.js 15
    Next.js Tutorial
    Next.js 14 Tutorial
    Next.js Tutorial for Beginners
    Catch all Segments
    Catch all Segments in Next.js
    Next js Tutorial
    Next js Catch All Segments
    #Next.js 14
    #Next.js 14 Tutorial
    #Next.js 15 Tutorial
    #Next.js Tutorial for Beginners
    #1million
    #react
    #reactjs
    #nextjs

Komentáře • 2