NextJS da kontentdan metama'lumotlarni dinamik uzatish

Oldingi darsda biz sayt kontentida metama'lumotlarni qanday belgilashni o'rgandik. Ushbu usul yaxshi, lekin har doim qo'llanilmaydi. Gap shundaki, sahifa metama'lumotlari dinamik yo'nalish parametriga bog'liq ravishda o'zgarishi mumkin.

Keling, buni misol bilan ko'rib chiqaylik. Faraz qilaylik, bizda uning id bo'yicha foydalanuvchini ko'rsatish uchun kontentli fayl bor. Faraz qilaylik, ushbu faylda foydalanuvchilar massivi mavjud:

let users = [
	'user1',
	'user2',
	'user3',
	'user4',
	'user5',
];

Keling, uzatilgan parametrga mos keladigan foydalanuvchi ma'lumotlarini chiqaramiz:

export default function User({ params }) {
	return <>
		<h1>user {params.id}</h1>
		<p>
			name: {users[params.id]}
		</p>
	</>;
}

Keling, endi muammomizga o'tamiz. Biz turli foydalanuvchilarni ko'rsatganimiz sababli, ular uchun metama'lumotlar ham har xil bo'lishi kerak. Biz ularni parametr qiymatiga bog'liq ravishda, dinamik shakllantirishimiz kerak.

Bu maxsus generateMetadata funksiyasi yordamida amalga oshiriladi, uni biz o'zimizning komponentimizdan eksport qilishimiz kerak:

export const generateMetadata = () => {
	return {
		title: '',
		description: '',
	};
};

Ushbu funksiyada bizga yo'nalish parametrlari mavjud:

export const generateMetadata = ({params}) => {
	console.log(params);
};

Keling, parametr qiymatiga bog'liq ravishda kerakli metama'lumotlarni qaytaraylik:

export const generateMetadata = ({params}) => {
	return {
		title: `Page for user {params.id}`,
		description: `Description for user "{users[params.id]}"`,
	};
};

/post/:id ko'rinishidagi manzillarni qayta ishlovchi yo'nalish yarating, bunda :id o'rnida istalgan raqam bo'lishi mumkin.

Faraz qilaylik, quyidagi massiv berilgan:

let posts = [
	{
		id: '1',
		title: 'post 1',
		desc: 'description for post 1',
		text: 'text1 text1 text1 text1 text1 text1 text1 text1',
	},
	{
		id: '2',
		title: 'post 2',
		desc: 'description for post 2',
		text: 'text2 text2 text2 text2 text2 text2 text2 text2',
	},
	{
		id: '3',
		title: 'post 3',
		desc: 'description for post 3',
		text: 'text3 text3 text3 text3 text3 text3 text3 text3',
	},
];

export default function Post() {
	
}

Berilgan id bo'yicha kerakli postning verstkasi chiqarilishi, shuningdek, to'g'ri sarlavha va meta tavsif o'rnatilishi uchun sozlang.