NextJS da Komponentlarni Import Qilish

Faqat ma'lumotlar fayllarini emas, balki komponentlarni ham import qilish mumkin, xuddi oddiy React bilan ishlashda odatlaganimizdek. Keling, buning qanday ishlashini ko'rib chiqaylik.

Boshlash uchun ba'zi kelishuvlarni kiritamiz. Bilganingizdek, src/app papkasida sayt sahifalari joylashgan. Keling, quyi komponentlarni src/comp papkasida joylashtiramiz.

Keling, endi biror sahifaga quyi komponentni ulaymiz. Quyidagi sahifamiz bor deylik:

export default function Test() {
	return <>
		<h1>Test</h1>
	</>;
}

Quyidagi quyi komponentimiz bor deylik:

export default function Child() {
	return <p>
		child
	</p>;
}

Endi quyi komponentimizni sahifamizga import qilaylik:

import Child from '@/comp/child/child.jsx';

export default function Test() {
	return <>
		<h1>Test</h1>
	</>;
}

Import qilingan komponentni qo'shamiz. Buning uchun komponent o'zgaruvchisi nomi bilan tegdan foydalanamiz:

import Child from '@/comp/child/child.jsx';

export default function Test() {
	return <>
		<h1>Test</h1>
		<Child />
	</>;
}

Bir nechta quyi komponentlar yarating. Ularni o'zingizning sahifalaringizga import qiling.