კომპონენტების იმპორტი NextJS-ში

იმპორტირება შესაძლებელია არა მხოლოდ მონაცემების ფაილები, არამედ კომპონენტებიც, ისევე, როგორც ჩვენ მივეჩვიეთ ჩვეულებრივ React-თან მუშაობისას. მოდით ვნახოთ, როგორ მუშაობს ეს.

დასაწყისისთვის, შემოვიღოთ რამდენიმე შეთანხმება. როგორც უკვე იცით, src/app დირექტორიაში განთავსებულია საიტის გვერდები. მოდით, შვილობილი კომპონენტები განვათავსოთ src/comp დირექტორიაში.

ახლა მოდით, დავაკავშიროთ შვილობილი კომპონენტი რომელიმე გვერდთან. დავუშვათ, გვაქვს შემდეგი გვერდი:

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

დავუშვათ, გვაქვს შემდეგი შვილობილი კომპონენტი:

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

ჩვენს გვერდზე დავაიმპორტოთ ჩვენი შვილობილი კომპონენტი:

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

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

შევასრულოთ იმპორტირებული კომპონენტის ჩასმა. ამისთვის გამოვიყენოთ ტეგი კომპონენტის ცვლადის სახელით:

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

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

შექმენით რამდენიმე შვილობილი კომპონენტი. დააიმპორტეთ ისინი თქვენს გვერდებზე.