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

इसे ऐसे बनाएं कि दिए गए आईडी के लिए पोस्ट का सही मार्कअप प्रदर्शित हो, और सही शीर्षक और मेटा विवरण भी सेट हो।