Komponentu imports NextJS

Importēt var ne tikai datņu failus, bet arī komponentus līdzīgi kā mēs esam pieraduši strādājot ar parasto React. Apskatīsim, kā tas darbojas.

Vispirms ieviesīsim dažus vienošanās. Kā jūs jau zināt, mapē src/app tiek izvietotas vietnes lapas. Izvietosim pakārtotos komponentus mapē src/comp.

Tagad pievienosim pakārtoto komponentu kādai lapai. Pieņemsim, ka mums ir šāda lapa:

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

Pieņemsim, ka mums ir šāds pakārtotais komponents:

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

Importēsim mūsu pakārtoto komponentu uz mūsu lapu:

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

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

Veiksim importētā komponenta ievietošanu. Lai to izdarītu, izmantosim tagu ar komponenta mainīgā nosaukumu:

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

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

Izveidojiet vairākus pakārtotos komponentus. Importējiet tos savās lapās.