Segmentmatrise i dynamisk rute i NextJS

Ved behov kan du få en matrise med alle segmenter i én variabel. For dette tas parameteren i firkantede parenteser, og før parameternavnet settes en ellipse. La oss se på et eksempel.

La oss si at vi har en rute av følgende type: /prod/:category/:name/:id/, hvor parametrene markert med kolon er dynamiske. La oss få en matrise med verdier av disse parameterne i en variabel. Navnet på denne variabelen kan være hva som helst. For eksempel, la oss kalle den slugs.

La oss lage følgende filstruktur:

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

La oss lage den tilsvarende komponenten:

app/prod/[...slugs]/page.jsxexport default function Prod({ params }) {
  console.log(params); // matrise med verdier
}

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,
  },
];