Масіў сегментаў у дынамічным маршруце ў NextJS

Пры неабходнасці можна атрымаць масіў усіх сегментаў у адну зменную. Для гэтага параметр бярэцца ў квадратныя дужкі, а перад імем параметра ставіцца шматкроп'е. Давайце паглядзім на прыкладзе.

Хай у нас ёсць маршрут наступнага выгляду: /prod/:category/:name/:id/, дзе адзначаныя двукроп'ем параметры з'яўляюцца дынамічнымі. Давайце атрымаем масіў значэнняў гэтых параметраў у якую-небудзь зменную. Назва гэтай зменнай можа быць любой. Напрыклад, назвем яе slugs.

Зробім наступную файлавую структуру:

Зробім адпаведны кампанент:

app/prod/[...slugs]/page.jsxexport default function Prod({ params }) {
  console.log(params); // масіў значэнняў
}
Задание 1

Зрабіце маршрут, які апрацоўвае адрасы выгляду /prod/:category/:name.

Хай дадзены наступны масіў:

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

Зрабіце так, каб у залежнасці ад значэння параметраў у вёрстцы кампанента вывадзіўся адпаведны прадукт.