Pole segmentov v dynamickej route v NextJS

V prípade potreby je možné získať pole všetkých segmentov do jednej premennej. Na tento účel sa parameter umiestni do hranatých zátvoriek a pred názov parametra sa umiestni trojbodka. Pozrime sa na príklad.

Predpokladajme, že máme route nasledujúceho tvaru: /prod/:category/:name/:id/, kde parametre označené dvojbodkou sú dynamické. Získajme pole hodnôt týchto parametrov do nejakej premennej. Názov tejto premennej môže byť ľubovoľný. Napríklad, nazvime ju slugs.

Vytvorme nasledujúcu súborovú štruktúru:

• /app//prod//[...slugs]/

Vytvorme zodpovedajúci komponent:

app/prod/[...slugs]/page.jsxexport default function Prod({ params }) {
  console.log(params); // pole hodnôt
}

page.jsxlet prods = [
  {
    category: 'catg1',
    name: 'prod1',
    cost: 100,
  },
  {
    category: 'catg1',
    name: 'prod2',
    cost: 200,
  },
  {
    category: 'catg2',
    name: 'prod1',
    cost: 300,
  },
  {
    category: 'catg2',
    name: 'prod3',
    cost: 400,
  },
];