NextJS-də Dinamik Routing-də Seqmentlər Massivi

Lazım olduqda, bütün seqmentləri bir dəyişənə massiv şəklində əldə etmək olar. Bunun üçün parametr kvadrat mötərizə içərisinə alınır və parametrin adından əvvəl üç nöqtə qoyulur. Gəlin bir nümunəyə baxaq.

Tutaq ki, bizim aşağıdakı kimi bir marşrutumuz var: /prod/:category/:name/:id/, burada nöqtələrlə qeyd olunan parametrlər dinamikdir. Gəlin bu parametrlərin bütün dəyərlərini massiv şəklində hansısa bir dəyişənə əldə edək. Bu dəyişənin adı istənilən ola bilər. Məsələn, onu slugs adlandıraq.

Gəlin aşağıdakı fayl strukturunu edək:

/app/
- /prod/
  - /[...slugs]/

Uyğun komponenti edək:

export default function Prod({ params }) {
	console.log(params); // dəyərlər massivi
}

/prod/:category/:name formasında ünvanları idarə edən bir marşrut edin.

Tutaq ki, aşağıdakı massiv verilib:

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

Parametrlərin dəyərindən asılı olaraq komponentin quruluşunda uyğun məhsulun göstərilməsini təmin edin.