Дар NextJS аз муҳтаво метамаълумотҳоро ба таври динамикӣ интиқол додан

Дар дарси қаблӣ мо омӯхтем, ки метамаълумотро дар муҳтавои сомона муқаррар кунем. Ин роҳ хуб аст, вале ҳамеша истифода намешавад. Масала он аст, ки метамаълумоти саҳифа метавонад вобаста ба параметри роути динамикӣ тағйир ёбад.

Биёед дар мисол бубинем. Фарз мекунем, ки мо файле бо муҳтаво дорем барои намоиши корбар аз рӯи id-и ӯ. Фарз мекунем, ки дар ин файл массиве бо корбарон мавҷуд аст:

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

Биёед маълумоти корбареро чоп кунем, ки ба параметри додашуда мувофиқат мекунад:

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

Ҳоло ба масъалаи худ мегардем. Азбаски мо корбарони гуногунро намоиш медиҳем, пас метамаълумот барои онҳо низ бояд гуногун бошад. Мо бояд онҳоро ба таври динамикӣ ташкил кунем, вобаста ба қимати параметр.

Ин бо ёрии функсияи махсуси generateMetadata анҷом дода мешавад, ки мо бояд аз компоненти худ экспорт кунем:

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

Дар ин функсия параметрҳои роут ба дастраси мо мешаванд:

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

Биёед метамаълумоти заруриро вобаста ба қимати параметр баргардонем:

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

Як роут созед, ки суроғаҳои намуди /post/:id-ро коркард кунад, ки ба ҷои :id метавонад ягон рақам бошад.

Фарз мекунем, ки массиви зерин дода шудааст:

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() {
	
}

Чунон созед, ки барои id-и додашуда верстаи постҳои зарурӣ чоп шавад, ва инчунин сарлавҳа ва тавсифи метаи дуруст муқаррар карда шавад.